/*
Theme Name: SVG Backgrounds Pro
Author: Matt Lipman
Description: Theme designed custom for SVG Backgrounds
Version: 1.0
License: Private License
Text Domain: svgbackgrounds
*/
:root {
  --BG-size: cover;
  --BG-color: none;
  --BG-image: none;
  --BG-repeat: no-repeat;
  --BG-position: center;
  --BG-attachment: scroll; }

svg * {
  transform-box: fill-box; }

/*!
 * Bootstrap Reboot v4.0.0-beta.2 (https://getbootstrap.com)
 * Copyright 2011-2017 The Bootstrap Authors
 * Copyright 2011-2017 Twitter, Inc.
 * Licensed under MIT (https://github.com/twbs/bootstrap/blob/master/LICENSE)
 * Forked from Normalize.css, licensed MIT (https://github.com/necolas/normalize.css/blob/master/LICENSE.md)
 */
*,
*::before,
*::after {
  box-sizing: border-box; }

html {
  font-family: sans-serif;
  font-size: 16px;
  /* https://css-tricks.com/rem-global-em-local/ */
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  -ms-overflow-style: scrollbar;
  -webkit-tap-highlight-color: transparent;
  scroll-behavior: smooth; }

@-ms-viewport {
  width: device-width; }
article, aside, dialog, figcaption, figure, footer, header, hgroup, main, nav, section {
  display: block; }

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  text-align: left;
  background-color: #fff; }

[tabindex="-1"]:focus {
  outline: 0 !important; }

hr {
  box-sizing: content-box;
  height: 0;
  overflow: visible; }
  
  section-wrap.h1 {
    font-size: 72px !important;
    background: -webkit-linear-gradient(rgb(255, 222, 4), rgb(183, 108, 2)) !important;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }

h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: 0.5rem; }

p {
  margin-top: 0;
  margin-bottom: 1rem; }

abbr[title],
abbr[data-original-title] {
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
  cursor: help;
  border-bottom: 0; }

ol,
ul,
dl {
  margin-top: 0;
  margin-bottom: 1rem; }

ol ol,
ul ul,
ol ul,
ul ol {
  margin-bottom: 0; }

dt {
  font-weight: 700; }

dd {
  margin-bottom: .5rem;
  margin-left: 0; }

blockquote {
  margin: 0 0 1rem; }

dfn {
  font-style: italic; }

b,
strong {
  font-weight: bolder; }

small {
  font-size: 80%; }

a {
  color: #880088;
  text-decoration: none;
  background-color: transparent;
  -webkit-text-decoration-skip: objects; }

a:hover {
  color: #404;
  text-decoration: underline; }

a:not([href]):not([tabindex]) {
  color: inherit;
  text-decoration: none; }

a:not([href]):not([tabindex]):focus, a:not([href]):not([tabindex]):hover {
  color: inherit;
  text-decoration: none; }

a:not([href]):not([tabindex]):focus {
  outline: 0; }

pre,
code,
kbd,
samp {
  font-family: monospace, monospace;
  font-size: 1em; }

pre {
  margin-top: 0;
  margin-bottom: 1rem;
  overflow: auto;
  -ms-overflow-style: scrollbar;
  white-space: pre-wrap;
  word-break: break-all; }
  @media (min-width: 660px) {
    pre {
      white-space: pre;
      word-break: normal; } }

figure {
  margin: 0 0 1rem; }

img {
  vertical-align: middle;
  border-style: none;
  width: auto;
  max-width: 100%;
  height: auto; }

svg:not(:root) {
  overflow: hidden; }

a,
area,
button,
[role="button"],
input:not([type="range"]),
label,
select,
summary,
textarea {
  -ms-touch-action: manipulation;
  touch-action: manipulation; }

button {
  border-radius: 0; }

button:focus {
  outline: 1px dotted;
  outline: 5px auto -webkit-focus-ring-color; }

input,
button,
select,
optgroup,
textarea {
  margin: 0;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit; }

button,
input {
  overflow: visible; }

button,
select {
  text-transform: none; }

button,
html [type="button"],
[type="reset"],
[type="submit"] {
  -webkit-appearance: button; }

button::-moz-focus-inner,
[type="button"]::-moz-focus-inner,
[type="reset"]::-moz-focus-inner,
[type="submit"]::-moz-focus-inner {
  padding: 0;
  border-style: none; }

input[type="radio"],
input[type="checkbox"] {
  box-sizing: border-box;
  padding: 0; }

input[type="date"],
input[type="time"],
input[type="datetime-local"],
input[type="month"] {
  -webkit-appearance: listbox; }

textarea {
  overflow: auto;
  resize: vertical;
  max-height: 60vh;
  width: 100%;
  border: 1px solid #EEE;
  background: #F7F7F7; }

progress {
  vertical-align: baseline; }

[type="number"]::-webkit-inner-spin-button,
[type="number"]::-webkit-outer-spin-button {
  height: auto; }

[type="search"] {
  outline-offset: -2px;
  -webkit-appearance: none; }

[type="search"]::-webkit-search-cancel-button,
[type="search"]::-webkit-search-decoration {
  -webkit-appearance: none; }

::-webkit-file-upload-button {
  font: inherit;
  -webkit-appearance: button; }

output {
  display: inline-block; }

[hidden] {
  display: none !important; }

input[type=range] {
  display: inline-block;
  height: 8px;
  margin: 0;
  background-color: transparent;
  -webkit-appearance: none;
  transition: transform .2s ease; }

input[type=range]:focus {
  outline: none; }
  input[type=range]:focus::-webkit-slider-thumb {
    background: #606 !important;
    transform: scale(1.1); }

input[type=range]:hover::-webkit-slider-thumb {
  background: #aa2068;
  transform: scale(1.1); }

input[type=range]::-webkit-slider-runnable-track {
  background: #CCC;
  border: 0;
  border-radius: 99px;
  width: 100%;
  height: 6px;
  cursor: pointer; }

input[type=range]::-webkit-slider-thumb {
  margin-top: -6px;
  width: 18px;
  height: 18px;
  background: #880088;
  border: none;
  border-radius: 99px;
  cursor: pointer;
  -webkit-appearance: none;
  transition: transform .2s ease, background .2s ease; }

input[type=range]::-moz-range-track {
  background: #CCC;
  border: 0;
  border-radius: 99px;
  width: 100%;
  height: 6px;
  cursor: pointer; }

input[type="range"]::-moz-range-progress {
  background-color: #880088; }

input[type=range]::-moz-range-thumb {
  width: 18px;
  height: 18px;
  background: #880088;
  border: 0;
  border-radius: 99px;
  cursor: pointer;
  transition: transform .2s ease, background .2s ease; }

input[type=range]::-ms-track {
  background: transparent;
  border-color: transparent;
  border-width: 10px 0;
  color: transparent;
  width: 100%;
  height: 8px;
  cursor: pointer; }

input[type=range]::-ms-fill-lower {
  background: #880088;
  border: 0;
  border-radius: 198px; }

input[type=range]::-ms-fill-upper {
  background: #CCC;
  border: 0;
  border-radius: 198px; }

input[type=range]::-ms-thumb {
  width: 18px;
  height: 18px;
  background: #880088;
  border: 0;
  border-radius: 99px;
  cursor: pointer;
  margin-top: 0px;
  transition: transform .2s ease, background .2s ease; }

input[type=range]:focus::-ms-fill-lower {
  background: #880088; }

input[type=range]:focus::-ms-fill-upper {
  background: #CCC; }

@supports (-ms-ime-align: auto) {
  /* Pre-Chromium Edge only styles, selector taken from hhttps://stackoverflow.com/a/32202953/7077589 */
  input[type=range] {
    margin: 0; } }
input[type="range"] {
  --webkitProgressPercent: 0%; }

input[type="range"]::-webkit-slider-runnable-track {
  background-image: linear-gradient(90deg, #880088 var(--webkitProgressPercent), #CCC var(--webkitProgressPercent)); }

body {
  position: relative;
  background-color: #303;
}
  body:after {
    content: "";
    position: fixed;
    /* stretch a fixed position to the whole screen */
    top: 0;
    height: 100vh;
    /* fix for mobile browser address bar appearing disappearing */
    left: 0;
    right: 0;
    z-index: -1;
    /* needed to keep in the background */
    background-color: var(--BG-color);
    background-image: var(--BG-image);
    background-repeat: var(--BG-repeat);
    background-position: var(--BG-position);
    background-attachment: scroll;
    -webkit-background-size: var(--BG-size);
    -moz-background-size: var(--BG-size);
    -o-background-size: var(--BG-size);
    background-size: var(--BG-size); }
  body.intro {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1600 800'%3E%3Cg fill-opacity='0.5'%3E%3Cpath fill='%23330033' d='M486 705.8c-109.3-21.8-223.4-32.2-335.3-19.4C99.5 692.1 49 703 0 719.8V800h843.8c-115.9-33.2-230.8-68.1-347.6-92.2C492.8 707.1 489.4 706.5 486 705.8z'/%3E%3Cpath fill='%23330033' d='M1600 0H0v719.8c49-16.8 99.5-27.8 150.7-33.5c111.9-12.7 226-2.4 335.3 19.4c3.4 0.7 6.8 1.4 10.2 2c116.8 24 231.7 59 347.6 92.2H1600V0z'/%3E%3Cpath fill='%23330033' d='M478.4 581c3.2 0.8 6.4 1.7 9.5 2.5c196.2 52.5 388.7 133.5 593.5 176.6c174.2 36.6 349.5 29.2 518.6-10.2V0H0v574.9c52.3-17.6 106.5-27.7 161.1-30.9C268.4 537.4 375.7 554.2 478.4 581z'/%3E%3Cpath fill='%23330033' d='M0 0v429.4c55.6-18.4 113.5-27.3 171.4-27.7c102.8-0.8 203.2 22.7 299.3 54.5c3 1 5.9 2 8.9 3c183.6 62 365.7 146.1 562.4 192.1c186.7 43.7 376.3 34.4 557.9-12.6V0H0z'/%3E%3Cpath fill='%23330033' d='M181.8 259.4c98.2 6 191.9 35.2 281.3 72.1c2.8 1.1 5.5 2.3 8.3 3.4c171 71.6 342.7 158.5 531.3 207.7c198.8 51.8 403.4 40.8 597.3-14.8V0H0v283.2C59 263.6 120.6 255.7 181.8 259.4z'/%3E%3Cpath fill='%233a003a' d='M1600 0H0v136.3c62.3-20.9 127.7-27.5 192.2-19.2c93.6 12.1 180.5 47.7 263.3 89.6c2.6 1.3 5.1 2.6 7.7 3.9c158.4 81.1 319.7 170.9 500.3 223.2c210.5 61 430.8 49 636.6-16.6V0z'/%3E%3Cpath fill='%23400040' d='M454.9 86.3C600.7 177 751.6 269.3 924.1 325c208.6 67.4 431.3 60.8 637.9-5.3c12.8-4.1 25.4-8.4 38.1-12.9V0H288.1c56 21.3 108.7 50.6 159.7 82C450.2 83.4 452.5 84.9 454.9 86.3z'/%3E%3Cpath fill='%23470047' d='M1600 0H498c118.1 85.8 243.5 164.5 386.8 216.2c191.8 69.2 400 74.7 595 21.1c40.8-11.2 81.1-25.2 120.3-41.7V0z'/%3E%3Cpath fill='%234e004e' d='M1397.5 154.8c47.2-10.6 93.6-25.3 138.6-43.8c21.7-8.9 43-18.8 63.9-29.5V0H643.4c62.9 41.7 129.7 78.2 202.1 107.4C1020.4 178.1 1214.2 196.1 1397.5 154.8z'/%3E%3Cpath fill='%23550055' d='M1315.3 72.4c75.3-12.6 148.9-37.1 216.8-72.4h-723C966.8 71 1144.7 101 1315.3 72.4z'/%3E%3C/g%3E%3C/svg%3E");
    background-attachment: fixed;
    background-size: cover;
    background-position: center; }

#DOM_CANVAS {
  position: fixed;
  top: 9999;
  left: 9999;
  z-index: -2; }
  #DOM_CANVAS svg, #DOM_CANVAS svg * {
    transform-box: view-box; }

#full-page-wrapper {
  min-height: 0vh;
  margin: 0;
  padding: 0; }

.page-wrap {
  max-width: 1400px;
  margin: 0 auto;
  padding: 30px; }
  .page-wrap .premium-header {
    margin: 40px auto 20px auto; }
    @media (min-width: 660px) {
      .page-wrap .premium-header {
        margin: 60px auto 30px auto; } }
    @media (min-width: 775px) {
      .page-wrap .premium-header {
        margin: 60px auto 45px auto; } }
    @media (min-width: 1200px) {
      .page-wrap .premium-header {
        margin: 60px auto; } }

.wrap {
  padding: 15px 10px; }
  @media (min-width: 660px) {
    .wrap {
      padding: 30px 10px; } }
  @media (min-width: 1200px) {
    .wrap {
      padding: 50px 10px; } }

.preload * {
  -webkit-transition: none !important;
  -moz-transition: none !important;
  -ms-transition: none !important;
  -o-transition: none !important; }
  .preload *:hover {
    transition-delay: .5s !important; }

img[data-lazy-src] {
  opacity: 0; }

img.lazyloaded {
  -webkit-transition: opacity 1.2s ease;
  -moz-transition: opacity 1.2s ease;
  transition: opacity 1.2s ease;
  opacity: 1; }

.text_center {
  text-align: center; }

/* <font-size> */
/* codementor.io/@ricardozea/100-responsive-typography-system-using-a-modular-scale-s5rhft58g */
body {
  font-size: 1.125rem;
  line-height: 1.5; }
  @media (min-width: 660px) {
    body {
      font-size: 1.25rem; } }
  @media (min-width: 1200px) {
    body {
      font-size: 1.3125rem; } }

/* </font-size>*/
/* <buttons>*/
a, button {
  cursor: pointer; }

.btn-purple, .btn-white, .btn-white-disabled, .btn-main, .btn-gradient, .btn-pro, .btn-subtle-dark, .btn-red {
  display: inline-block;
  font-size: 1rem;
  padding: 10px 20px;
  border-radius: 99px;
  background: #FFF;
  color: #880088;
  text-decoration: none;
  cursor: pointer;
  transition: background .2s ease, color .2s ease; }
  @media (min-width: 660px) {
    .btn-purple, .btn-white, .btn-white-disabled, .btn-main, .btn-gradient, .btn-pro, .btn-subtle-dark, .btn-red {
      font-size: 1.125rem; } }
  @media (min-width: 900px) {
    .btn-purple, .btn-white, .btn-white-disabled, .btn-main, .btn-gradient, .btn-pro, .btn-subtle-dark, .btn-red {
      font-size: 1.25rem; } }
  .btn-purple:hover, .btn-white:hover, .btn-white-disabled:hover, .btn-main:hover, .btn-gradient:hover, .btn-pro:hover, .btn-subtle-dark:hover, .btn-red:hover {
    text-decoration: none; }

.btn-purple, .btn-subtle-dark {
  background: #880088;
  color: #FFF;
  transition: background .2s ease, color .2s ease, filter 2s ease; }
  .btn-purple:hover, .btn-subtle-dark:hover {
    background: #aa2068;
    color: #FFF; }
  .btn-purple:disabled, .btn-purple[disabled], .btn-subtle-dark:disabled, .btn-subtle-dark[disabled] {
    opacity: .4;
    cursor: context-menu; }
    .btn-purple:disabled:hover, .btn-purple[disabled]:hover, .btn-subtle-dark:disabled:hover, .btn-subtle-dark[disabled]:hover {
      background: #880088;
      filter: grayscale(1) blur(5px); }

.btn-subtle-dark {
  background: #505; }

.btn-red {
  background: #cc3f47;
  color: #FFF; }
  .btn-red:hover {
    background: #aa2068;
    color: #FFF; }

.btn-full {
  display: block;
  width: 100%;
  text-align: center; }

.btn-main {
  background: #aa2068;
  color: #FFF;
  transition: background .2s ease, color .2s ease, filter 2s ease, box-shadow .2s ease;
  box-shadow: inset 8px -18px 20px -20px rgba(136, 0, 136, 0.2), inset -34px 73px 20px -60px rgba(240, 159, 51, 0.2); }
  .btn-main:hover {
    background: #d55742;
    box-shadow: inset 30px -65px 20px -60px #880088, inset -30px 70px 20px -60px rgba(240, 159, 51, 0.8);
    color: #FFF; }
  .btn-main:disabled, .btn-main[disabled] {
    opacity: .4;
    cursor: context-menu; }
    .btn-main:disabled:hover, .btn-main[disabled]:hover {
      background: #880088;
      filter: grayscale(1) blur(5px); }

.btn-gradient {
  padding: 15px 40px;
  font-size: 1.125rem;
  text-shadow: 2px 2px 3px rgba(136, 0, 136, 0.5);
  background: linear-gradient(35deg, #880088, #cc3f47, #f09f33, #de6f3d, #aa2068);
  color: #FFF;
  background-size: 200%;
  background-position: left center;
  background-repeat: no-repeat;
  box-shadow: inset 8px -18px 20px -20px rgba(136, 0, 136, 0.1), inset -34px 73px 20px -60px rgba(240, 159, 51, 0.1);
  transition: background .2s ease, box-shadow .2s ease; }
  @media (min-width: 660px) {
    .btn-gradient {
      font-size: 1.25rem; } }
  @media (min-width: 900px) {
    .btn-gradient {
      font-size: 24px; } }
  .btn-gradient:hover {
    color: #FFF;
    background-size: 200%;
    background-position: center center;
    box-shadow: inset 30px -65px 40px -60px #880088, inset -30px 70px 20px -60px rgba(170, 32, 104, 0.8); }

.btn-pro {
  padding: 10px 24px;
  white-space: nowrap;
  font-size: 1.2rem;
  font-weight: bold;
  text-shadow: 2px 2px 3px rgba(136, 0, 136, 0.5);
  background: linear-gradient(15deg, #880088, #aa2068, #cc3f47, #de6f3d, #f09f33, #de6f3d, #cc3f47, #aa2068, #880088);
  color: #FFF;
  background-size: 300%;
  background-position: left center;
  background-repeat: no-repeat;
  transition: background .3s ease; }
  @media (min-width: 660px) {
    .btn-pro {
      font-size: 1.4rem; } }
  @media (min-width: 900px) {
    .btn-pro {
      font-size: 1.5rem; } }
  .btn-pro svg {
    display: inline-block;
    width: 24px;
    height: 16px;
    margin-right: 10px;
    fill: #f09f33;
    transition: fill .2s ease;
    padding: 0; }
    @media (min-width: 660px) {
      .btn-pro svg {
        width: 27px;
        height: 18px; } }
    @media (min-width: 900px) {
      .btn-pro svg {
        width: 33px;
        height: 22px; } }
  .btn-pro:hover {
    color: #FFF;
    background-size: 320%;
    background-position: right center; }
    .btn-pro:hover svg {
      fill: #FFF; }

.btn-pro-sm {
  padding: 6px 18px;
  font-size: 1rem; }
  @media (min-width: 660px) {
    .btn-pro-sm {
      font-size: 1.1rem; } }
  @media (min-width: 900px) {
    .btn-pro-sm {
      font-size: 1.25rem; } }
  .btn-pro-sm svg {
    width: 18px;
    height: 12px; }
    @media (min-width: 660px) {
      .btn-pro-sm svg {
        width: 21px;
        height: 14px; } }
    @media (min-width: 900px) {
      .btn-pro-sm svg {
        width: 24px;
        height: 16px; } }

a.btn-subtle, button.btn-subtle {
  display: inline-block;
  color: #880088;
  background: #FFF;
  border-radius: 99px;
  padding: 8px 20px;
  box-shadow: inset 0 0 0 2px #F8EFF8;
  border: none;
  cursor: pointer;
  transition: background .2s ease, color .2s ease, box-shadow .2s ease; }
  a.btn-subtle:hover, a.btn-subtle:focus, button.btn-subtle:hover, button.btn-subtle:focus {
    background: #F8EFF8;
    color: #404;
    box-shadow: inset 0 0 0 2px #F0DFF0;
    text-decoration: none;
    outline: none; }
    a.btn-subtle:hover span.tag, a.btn-subtle:focus span.tag, button.btn-subtle:hover span.tag, button.btn-subtle:focus span.tag {
      background: #DAB0DA; }
  a.btn-subtle span.tag, button.btn-subtle span.tag {
    font-size: .8em;
    background: #F0DFF0;
    border-radius: 4px;
    padding: 0 4px 2px 4px;
    vertical-align: 2px;
    transition: background .2s ease; }

a.btn-card {
  display: block;
  padding: 60px 30px;
  font-size: 1.6rem;
  font-weight: bold;
  text-align: center;
  color: #FFF;
  border-radius: 15px;
  background-color: #606;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2000 1500'%3E%3Cdefs%3E%3Cg id='d'%3E%3Cpath id='a' d='M0 23C27 23 15 0 42 0s15 23 41 23S99 0 125 0s15 23 42 23 15-23 41-23' transform='scale(0.8)' vector-effect='non-scaling-stroke'/%3E%3Cuse href='%23a' y='50'/%3E%3C/g%3E%3Cpath id='e' d='M0 0h180v180H0z' vector-effect='non-scaling-stroke'/%3E%3Cpath id='f' d='M0 50h100M50 0v100' vector-effect='non-scaling-stroke'/%3E%3Cpath id='g' d='M0 0h50v50h50v50h50v50' vector-effect='non-scaling-stroke'/%3E%3Cpath id='h' d='M0 121C0 54 54 0 121 0s114 54 114 121' vector-effect='non-scaling-stroke'/%3E%3Cpath id='i' d='M0 0l-100 173h200z' vector-effect='non-scaling-stroke'/%3E%3Cpath id='j' d='M0 0l-100 73 38 117H62l38-117z' vector-effect='non-scaling-stroke'/%3E%3C/defs%3E%3Cpattern id='p' width='2000' height='1500' patternUnits='userSpaceOnUse' patternTransform='rotate(162 1000 750) scale(0.44) translate(1272.73 954.55)'%3E%3Cg id='k' stroke-width='10' fill='none' %3E%3Cg stroke='%23880088'%3E%3Ccircle id='b' r='25' vector-effect='non-scaling-stroke'/%3E%3Cuse href='%23b' x='-42' y='73'/%3E%3Cuse href='%23b' x='42' y='73'/%3E%3Cuse href='%23e' x='975' y='320' transform='rotate(-55)'/%3E%3C/g%3E%3Cg stroke='%23880088'%3E%3Cuse href='%23d' x='-400' y='750' transform='rotate(35)'/%3E%3Cuse href='%23j' x='377' y='1056'/%3E%3C/g%3E%3Cg stroke='%23880088'%3E%3Cuse href='%23h' x='222' y='-695' transform='rotate(-45)'/%3E%3Cuse href='%23f' x='380' y='556' transform='rotate(-45)'/%3E%3C/g%3E%3Cg stroke='%23880088'%3E%3Cuse href='%23a' x='1222' y='1059' transform='rotate(12)'/%3E%3Cuse href='%23b' x='44' y='155' transform='scale(3)'/%3E%3C/g%3E%3Cg stroke='%23880088'%3E%3Cuse href='%23g' x='410' y='455'/%3E%3Cuse href='%23i' x='1581' y='23' transform='rotate(-12)'/%3E%3C/g%3E%3C/g%3E%3Cuse href='%23k' x='2000'/%3E%3Cuse href='%23k' y='1500'/%3E%3Cuse href='%23k' x='2000' y='1500'/%3E%3C/pattern%3E%3Crect fill='url(%23p)' width='100%25' height='100%25'/%3E%3C/svg%3E");
  background-size: cover; }
  @media (min-width: 660px) {
    a.btn-card {
      padding: 90px 30px;
      font-size: 2rem; } }
  @media (min-width: 1200px) {
    a.btn-card {
      padding: 120px 30px;
      font-size: 2.4rem; } }
  a.btn-card:hover {
    background-color: #202;
    text-decoration: none;
    color: #f09f33;
    background-position: center; }

/* </buttons>*/
/* <HEADER>*/
#header {
  background: #FFF;
  box-shadow: 0 1px 0 0 rgba(0, 0, 0, 0.1);
  display: grid;
  grid-template-columns: 1fr 80px;
  align-items: center;
  font-size: 1.125rem; }
  @media (min-width: 900px) {
    #header {
      grid-template-columns: 1fr 1fr 1fr;
      justify-content: space-between; } }
  #header #nav-logo a#LOGO {
    display: block;
    padding: 20px;
    max-width: 300px;
    fill: #880088;
    transition: fill .2s ease; }
    #header #nav-logo a#LOGO svg {
      display: block;
      width: 100%; }
    #header #nav-logo a#LOGO #svg-logo-use {
      fill: url(#logo-gradient);
      opacity: 0;
      transition: opacity .5s ease; }
    #header #nav-logo a#LOGO .stop1 {
      stop-color: #880088; }
    #header #nav-logo a#LOGO .stop2 {
      stop-color: #aa2068; }
    #header #nav-logo a#LOGO .stop3 {
      stop-color: #cc3f47; }
    #header #nav-logo a#LOGO .stop4 {
      stop-color: #de6f3d; }
    #header #nav-logo a#LOGO .stop5 {
      stop-color: #f09f33; }
    #header #nav-logo a#LOGO:hover {
      fill: #bb2f57; }
      #header #nav-logo a#LOGO:hover #svg-logo-use {
        opacity: 1; }
  #header #nav-account {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    padding: 10px 25px; }
    #header #nav-account a {
      margin-left: 15px; }
    #header #nav-account .drop_down a {
      margin-left: 0; }
  #header #nav-account,
  #header #nav-nav {
    display: none; }
  @media (min-width: 900px) {
    #header #nav-account {
      display: flex; }
    #header #nav-nav {
      display: block; }
    #header #nav-button {
      display: none; } }

#nav-mobile {
  display: block;
  background: #F8EFF8;
  overflow: hidden;
  max-height: 0;
  transition: max-height .2s ease; }
  #nav-mobile ul {
    margin: 0;
    padding: 15px; }
    #nav-mobile ul li {
      list-style-type: none; }
      #nav-mobile ul li a {
        display: block;
        text-align: center;
        padding: 8px; }

#btn-mobile {
  display: block;
  width: 68px;
  height: 68px;
  margin: 0;
  padding: 16px;
  background: #FFF;
  border-radius: 40px;
  border: none;
  cursor: pointer;
  transition: color .2s ease; }
  #btn-mobile svg {
    width: 100%;
    max-width: 36px;
    max-height: 36px;
    fill: none;
    stroke: #880088;
    stroke-width: 4px;
    stroke-linecap: round;
    margin: 0 auto;
    transition: fill .2s ease; }
  #btn-mobile:hover {
    background: #F8EFF8;
    color: #404; }
    #btn-mobile:hover svg {
      fill: #404; }

button#btn-mobile .line-mid, button#btn-mobile .line-ctr {
  transform: rotate(0deg);
  transform-origin: 50% 50%; }
button#btn-mobile .line-top, button#btn-mobile .line-btm {
  transform: translateY(0deg);
  transform-origin: 50% 50%;
  opacity: 1; }
button#btn-mobile.contract .line-top {
  transform: translateY(0px);
  animation: lineTopBack .3s ease-in-out; }
button#btn-mobile.contract .line-mid {
  transform: rotate(0deg);
  animation: lineMidBack .3s ease-in-out; }
button#btn-mobile.contract .line-ctr {
  transform: rotate(0deg);
  animation: lineCtrBack .3s ease-in-out; }
button#btn-mobile.contract .line-btm {
  transform: translateY(0px);
  animation: lineBtmBack .3s ease-in-out; }
button#btn-mobile.expand .line-top {
  transform: translateY(14px);
  animation: lineTop .3s ease-in-out;
  opacity: 0; }
button#btn-mobile.expand .line-mid {
  transform: translateY(0px) rotate(135deg);
  animation: lineMid .3s ease-in-out; }
button#btn-mobile.expand .line-ctr {
  transform: translateY(0px) rotate(225deg);
  animation: lineCtr .3s ease-in-out; }
button#btn-mobile.expand .line-btm {
  transform: translateY(-14px);
  animation: lineBtm .3s ease-in-out;
  opacity: 0; }

@keyframes lineTop {
  0% {
    transform: translateY(0px);
    opacity: 1; }
  100% {
    transform: translateY(14px);
    opacity: 0; } }
@keyframes lineTopBack {
  0% {
    transform: translateY(14px);
    opacity: 0; }
  100% {
    transform: translateY(0px);
    opacity: 1; } }
@keyframes lineMid {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(135deg); } }
@keyframes lineMidBack {
  0% {
    transform: rotate(135deg); }
  100% {
    transform: rotate(360deg); } }
@keyframes lineCtr {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(225deg); } }
@keyframes lineCtrBack {
  0% {
    transform: rotate(225deg); }
  100% {
    transform: rotate(360deg); } }
@keyframes lineBtm {
  0% {
    transform: translateY(0px);
    opacity: 1; }
  100% {
    transform: translateY(-14px);
    opacity: 0; } }
@keyframes lineBtmBack {
  0% {
    transform: translateY(-14px);
    opacity: 0; }
  100% {
    transform: translateY(0px);
    opacity: 1; } }
.drop_target {
  font-size: 1.25rem;
  display: flex;
  justify-content: center;
  padding: 10px;
  margin: 0; }
  .drop_target ul {
    padding: 0;
    margin: 0; }
  .drop_target li {
    list-style-type: none;
    display: block;
    padding: 0;
    margin: 0; }
  .drop_target > li > a {
    padding: 15px 25px;
    display: block;
    background: rgba(248, 239, 248, 0);
    border-radius: 3px;
    text-decoration: none;
    transition: background .2s ease; }
    .drop_target > li > a:hover {
      background: #f8eff8; }
  .drop_target .drop_wrap {
    position: relative;
    top: 0;
    left: 0; }
    .drop_target .drop_wrap > a {
      position: relative; }
    .drop_target .drop_wrap .drop_down {
      position: absolute;
      z-index: 9999;
      backface-visibility: hidden;
      /* prevent flickering */
      display: flex;
      left: 50%;
      padding: 0 30px;
      pointer-events: none;
      transform-origin: top center;
      transform: translate(-50%, 30px);
      opacity: 0;
      transition: opacity .3s ease, transform .3s ease;
      transition-delay: .2s;
      background: #FFF;
      box-shadow: 0 4px 7px 0 rgba(51, 0, 51, 0.2), 0 22px 33px 0 rgba(68, 0, 68, 0.1);
      border-radius: 5px; }
      .drop_target .drop_wrap .drop_down a {
        margin: 0; }
      .drop_target .drop_wrap .drop_down:before, .drop_target .drop_wrap .drop_down:after {
        content: "";
        position: absolute;
        z-index: 9998;
        top: 0;
        left: 50%;
        width: 30px;
        height: 30px;
        clip-path: polygon(50% 50%, 0% 100%, 100% 100%); }
      .drop_target .drop_wrap .drop_down:before {
        background-color: #FFF;
        transform: translate(-15px, -29px); }
      .drop_target .drop_wrap .drop_down:after {
        z-index: 9997;
        background-color: rgba(0, 0, 0, 0.05);
        transform: translate(-15px, -32px);
        filter: blur(22px); }
      .drop_target .drop_wrap .drop_down > li {
        padding: 30px;
        margin: 30px; }
        .drop_target .drop_wrap .drop_down > li.drop_slim {
          padding: 15px 0;
          margin: 0; }
      .drop_target .drop_wrap .drop_down.drop_right {
        left: auto;
        right: 0;
        transform-origin: top center;
        transform: translate(0, 30px); }
        .drop_target .drop_wrap .drop_down.drop_right:before, .drop_target .drop_wrap .drop_down.drop_right:after {
          left: auto;
          right: 30px; }
    .drop_target .drop_wrap:hover > a, .drop_target .drop_wrap:focus-within > a, .drop_target .drop_wrap:focus > a {
      transition-delay: 0s;
      background: #F8EFF8; }
    .drop_target .drop_wrap:hover .drop_down, .drop_target .drop_wrap:focus-within .drop_down, .drop_target .drop_wrap:focus .drop_down {
      pointer-events: auto;
      transform: translate(-50%, 0px);
      transition-delay: 0s;
      opacity: 1; }
      .drop_target .drop_wrap:hover .drop_down.drop_right, .drop_target .drop_wrap:focus-within .drop_down.drop_right, .drop_target .drop_wrap:focus .drop_down.drop_right {
        transform: translate(0, 0px); }
  .drop_target a {
    white-space: nowrap; }

/* </HEADER>*/
#footer {
  margin: 0;
  text-align: center;
  background: #F8EFF8;
  color: #404;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1); }
  #footer p {
    margin: 0; }
  #footer #footer-top {
    font-size: 1.2rem;
    background: #FFF;
    padding: 10px;
    border-bottom: 1px solid #EEE; }
    @media (min-width: 660px) {
      #footer #footer-top {
        padding: 30px; } }
  #footer #footer-middle {
    background: #F7F7F7;
    border-bottom: 1px solid #E7E7E7;
    padding: 10px; }
    @media (min-width: 660px) {
      #footer #footer-middle {
        padding: 30px; } }
  #footer .container {
    padding: 5px 20px;
    font-size: 12px; }
  #footer #footer-links {
    text-align: center; }
    @media (min-width: 1200px) {
      #footer #footer-links {
        display: flex;
        justify-content: center; } }
    #footer #footer-links a {
      color: #450057;
      color: #777;
      background: #FFF;
      transition: color .2s ease, background .2s ease;
      padding: 8px 12px;
      font-weight: 400;
      display: inline-block;
      border-radius: 50px; }
      @media (min-width: 660px) {
        #footer #footer-links a {
          padding: 10px 25px; } }
    #footer #footer-links a:hover {
      color: #33003e;
      color: #000;
      background: #EEE;
      text-decoration: none; }
  #footer .social-btn {
    width: 55px;
    display: inline-block;
    padding: 10px;
    vertical-align: top; }
    #footer .social-btn svg {
      width: 100%;
      fill: #450057;
      transition: fill .2s ease; }
  #footer .social-btn:hover svg {
    fill: #a22556 !important; }

#about-section {
  background: #FFF;
  margin: 0;
  font-size: 1.4rem;
  line-height: 1.4;
  box-shadow: 0 0 0 1px #F0DFF0; }
  @media (min-width: 900px) {
    #about-section {
      padding: 120px 30px; } }
  @media (min-width: 660px) {
    #about-section {
      font-size: 1.5rem; } }
  @media (min-width: 1200px) {
    #about-section {
      font-size: 1.8rem; } }
  #about-section .about-shell {
    background: #F8EFF8;
    border-radius: 10px;
    padding: 20px;
    max-width: 900px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    justify-content: center;
    align-items: center; }
    @media (min-width: 660px) {
      #about-section .about-shell {
        padding: 30px; } }
    @media (min-width: 1200px) {
      #about-section .about-shell {
        padding: 60px; } }
    @media (min-width: 900px) {
      #about-section .about-shell {
        grid-template-columns: 200px 1fr;
        grid-gap: 50px; } }
  #about-section a.twitter {
    fill: #880088;
    color: #880088; }
    #about-section a.twitter svg {
      display: inline-block;
      width: 24px;
      height: 24px;
      vertical-align: -3px;
      transform: fill .2s ease; }
    #about-section a.twitter:hover {
      text-decoration: none;
      fill: #aa2068;
      color: #aa2068; }
  #about-section .about-img img {
    display: block;
    max-width: 200px;
    border-radius: 100px; }
  #about-section p {
    margin: 0 auto;
    max-width: 600px; }
  @media (min-width: 900px) {
    #about-section #about-foot {
      grid-column: 1 / 3; } }
  #about-section #about-foot p {
    max-width: 100%; }

.multi-column {
  max-width: 1060px;
  margin: 0 auto;
  padding: 15px;
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 30px; }
  @media (min-width: 900px) {
    .multi-column {
      grid-template-columns: 1fr 1fr; } }

.post-wrap {
  padding: 10px; }

.post {
  background: #FFF;
  border-top: 5px solid #AAA;
  padding: 30px;
  width: 100%;
  max-width: 500px;
  margin: 0 auto; }

/*
blockquote{
	background:#EEE;
	border-radius: 2px;
	padding:15px;
	font-size:0.8rem;
}
blockquote pre{	
	font-size:0.8rem;
	padding:0;
	margin:0;
}
*/
.more-excerpt {
  color: #AAA; }

.bbtn {
  background: #450057;
  color: #FFF !important;
  border-radius: 50px;
  padding: 4px 10px;
  transition: background 0.2s; }

.bbtn:hover {
  background: #a22556;
  text-decoration: none; }

.bbtn:focus {
  outline: none;
  background: #d03855;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.1); }

#container {
  position: relative;
  display: block;
  padding: 60px 0 0 0;
  grid-gap: 0; }
  @media (min-width: 775px) {
    #container {
      display: grid;
      padding: 120px 0 0 0;
      grid-template-columns: 330px 1fr; } }
  @media (min-width: 1200px) {
    #container {
      display: grid;
      grid-template-columns: 390px 1fr; } }
  #container .end-spacer {
    height: 60px; }
    @media (min-width: 450px) {
      #container .end-spacer {
        height: 120px; } }
    @media (min-width: 660px) {
      #container .end-spacer {
        height: 160px; } }
    @media (min-width: 1200px) {
      #container .end-spacer {
        height: 240px; } }
  #container .end-cap {
    grid-column: 1/-1;
    padding: 0;
    height: 50px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100' preserveAspectRatio='none' viewBox='0 0 1600 130'%3E%3ClinearGradient id='g' gradientUnits='userSpaceOnUse' x1='0' y1='70' x2='1600' y2='70'%3E%3Cstop offset='0' stop-color='%23808'/%3E%3Cstop offset='.5' stop-color='%23CC3F47'/%3E%3Cstop offset='1' stop-color='%23F09F33'/%3E%3C/linearGradient%3E%3Cpath d='M1600 130L1600 110c-400 0-400-100-800-100S400 110 0 110L0 130z' fill='%23404'/%3E%3Cpath d='M1600 120c-400 0-400-100-800-100S400 120 0 120' fill='none' stroke='url(%23g)' stroke-width='5'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-size: 100% 50px;
    background-position: bottom center; }
    @media (min-width: 660px) {
      #container .end-cap {
        background-size: 100% 100px;
        height: 100px; } }
  #container > div {
    z-index: 98; }

.no-click {
  pointer-events: none; }

.overlayBox {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 122;
  width: 100%;
  height: 100%;
  display: none;
  background: rgba(136, 0, 136, 0.3);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1200 800'%3E%3Cdefs%3E%3CradialGradient id='a' cx='0' cy='800' r='800' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23df6338'/%3E%3Cstop offset='1' stop-color='%23df6338' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='b' cx='1200' cy='800' r='800' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23ce0732'/%3E%3Cstop offset='1' stop-color='%23ce0732' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='c' cx='600' cy='0' r='600' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23b41569'/%3E%3Cstop offset='1' stop-color='%23b41569' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='d' cx='600' cy='800' r='600' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23f09f33'/%3E%3Cstop offset='1' stop-color='%23f09f33' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='e' cx='0' cy='0' r='800' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23cc3f47'/%3E%3Cstop offset='1' stop-color='%23cc3f47' stop-opacity='0'/%3E%3C/radialGradient%3E%3CradialGradient id='f' cx='1200' cy='0' r='800' gradientUnits='userSpaceOnUse'%3E%3Cstop offset='0' stop-color='%23880088'/%3E%3Cstop offset='1' stop-color='%23880088' stop-opacity='0'/%3E%3C/radialGradient%3E%3C/defs%3E%3Crect fill='url(%23a)' width='1200' height='800'/%3E%3Crect fill='url(%23b)' width='1200' height='800'/%3E%3Crect fill='url(%23c)' width='1200' height='800'/%3E%3Crect fill='url(%23d)' width='1200' height='800'/%3E%3Crect fill='url(%23e)' width='1200' height='800'/%3E%3Crect fill='url(%23f)' width='1200' height='800'/%3E%3C/svg%3E");
  background-size: cover;
  background-position: center; }
  .overlayBox.active {
    display: grid;
    justify-content: center;
    align-items: center; }
  .overlayBox .theBox {
    position: relative;
    background: #FFF;
    color: #880088;
    padding: 0;
    width: 100%;
    max-width: 1000px;
    border-radius: 5px;
    box-shadow: 0 0.7px 1px rgba(0, 0, 0, 0.055), 0 1.7px 2.6px rgba(0, 0, 0, 0.056), 0 3.5px 5.3px rgba(0, 0, 0, 0.058), 0 7.3px 11px rgba(0, 0, 0, 0.074), 0 20px 30px rgba(0, 0, 0, 0.2); }
    @media (min-width: 660px) {
      .overlayBox .theBox {
        padding: 0 0 30px 0; } }
    .overlayBox .theBox .btn-subtle {
      font-size: 1rem; }
  .overlayBox#infoBox .theBox {
    max-width: 800px; }
  .overlayBox .theBoxWrapper {
    padding: 45px 30px 0 30px; }
    @media (min-width: 660px) {
      .overlayBox .theBoxWrapper {
        padding: 75px 60px 0 60px; } }
    .overlayBox .theBoxWrapper p.boxHeading {
      margin-bottom: 0; }
  .overlayBox .theBoxWrap {
    display: grid;
    grid-template-columns: 1fr;
    margin-top: 120px;
    max-height: 80vh;
    overflow-y: auto;
    padding: 0 0 30px 0;
    background: #FFF; }
    @media (min-width: 660px) {
      .overlayBox .theBoxWrap {
        padding: 0; } }
    .overlayBox .theBoxWrap.simple {
      margin-top: 30px; }
    .overlayBox .theBoxWrap > div {
      padding: 15px 30px; }
    @media (min-width: 900px) {
      .overlayBox .theBoxWrap {
        grid-template-columns: 1fr 1fr;
        background-image: linear-gradient(#F8EFF8, #F8EFF8);
        background-size: 2px 100%;
        background-repeat: no-repeat;
        background-position: center center; }
        .overlayBox .theBoxWrap.singleCol {
          grid-template-columns: 1fr;
          background-image: none; }
        .overlayBox .theBoxWrap > div {
          padding: 30px 60px; } }
  .overlayBox button.close {
    position: absolute;
    top: 8px;
    right: 8px;
    background: #C380C3;
    border: none;
    width: 48px;
    height: 48px;
    padding: 9px;
    border-radius: 99px;
    box-shadow: 0 0 0 0 #C380C3;
    transition: background .2s ease, box-shadow .2s ease; }
    .overlayBox button.close * {
      pointer-events: none; }
    .overlayBox button.close svg {
      display: block;
      stroke: #FFF;
      stroke-width: 2px;
      transition: stroke-width .2s ease; }
    .overlayBox button.close:hover, .overlayBox button.close:focus {
      background: #880088;
      box-shadow: 0 0 0 5px #880088;
      outline: none; }
      .overlayBox button.close:hover svg, .overlayBox button.close:focus svg {
        stroke-width: 4px; }
  .overlayBox .boxContentWrap {
    padding: 10px 0; }
    @media (min-width: 660px) {
      .overlayBox .boxContentWrap {
        padding: 10px 0 10px 30px; } }
    .overlayBox .boxContentWrap .btn-subtle {
      margin: 6px 6px 6px 0; }
    .overlayBox .boxContentWrap p {
      margin: 0; }
  .overlayBox .boxHeading {
    padding: 5px 0 15px 0;
    font-size: 24px;
    font-weight: bold; }
    .overlayBox .boxHeading span {
      box-shadow: inset 0 -2px 0 0 #F8EFF8; }
  .overlayBox .thumbWrap {
    text-align: center;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -60px); }
    .overlayBox .thumbWrap img {
      background: #FFF;
      padding: 5px;
      width: 130px;
      height: 130px;
      border-radius: 65px; }

.thumb-display {
  position: relative;
  display: grid;
  grid-gap: 15px;
  grid-template: 1fr 1fr / 1fr 1fr 1fr; }
  .thumb-display button {
    z-index: 3; }
  .thumb-display.thumb-d2 button:nth-child(1) {
    grid-column: 1 / span 2;
    grid-row: 1 / span 2; }
  .thumb-display.thumb-d2 button:nth-child(2) {
    grid-column: 2 / span 2;
    grid-row: 1 / span 2; }
  .thumb-display.thumb-d3 {
    grid-gap: 30px; }
    .thumb-display.thumb-d3 button:first-of-type {
      grid-column: 1 / span 2;
      grid-row: 1 / span 2; }
  .thumb-display.thumb-d4 {
    grid-template: 1fr 1fr 1fr / 1fr 1fr 1fr; }
    .thumb-display.thumb-d4 button:nth-child(1) {
      grid-column: 1 / span 2;
      grid-row: 1 / span 2; }
    .thumb-display.thumb-d4 button:nth-child(2) {
      grid-column: 2 / span 2;
      grid-row: 1 / span 2; }
    .thumb-display.thumb-d4 button:nth-child(3) {
      grid-column: 1 / span 2;
      grid-row: 2 / span 2; }
    .thumb-display.thumb-d4 button:nth-child(4) {
      grid-column: 2 / span 2;
      grid-row: 2 / span 2; }

#purchaseOptions .spaceWrap, .purchaseOptions .spaceWrap {
  text-align: center;
  padding: 30px 0 0 0; }
@media (max-width: 659px) {
  #purchaseOptions .fullPitch, .purchaseOptions .fullPitch {
    display: none; } }
#purchaseOptions .mobilePitch, .purchaseOptions .mobilePitch {
  display: block; }
  @media (min-width: 660px) {
    #purchaseOptions .mobilePitch, .purchaseOptions .mobilePitch {
      display: none; } }

/*
a.btn-offer{
	display: grid;
	grid-template-columns: 80px 1fr;
	align-items: center;
	grid-gap: 15px;	
	padding: 15px;
	border-radius: 5px;
	transition: color .2s ease, background .2s ease, transform .2s ease;
	.price{
		background: $purple;
		color: #FFF;
		border-radius: 99px;
		width: 80px;
		height: 80px;
		line-height: 80px;
		text-align: center;
		transition: background .2s ease;
		b{
			font-size: 28px;
			vertical-align: -2px;
		}
		sup{
			line-height: 30px;
		}
	}
	&:nth-child(1) .price{
		background: $pink;
	}
	&:nth-child(2) .price{
		background: $red;
	}	
	.details{
		p:first-child{
			font-size: 22px;
			font-weight: bold;
		}
		p{
			font-size: 1rem;
		}
	}
	&:hover{
		transform: translateY(-8px);
		background: $purple-subtle;
		text-decoration: none;
		color: #404;
		.price{
			background: $purple;
		}
	}
}*/
#exportBox {
  z-index: 123; }

#SVGBG_UI {
  font-size: 14px;
  line-height: 16px;
  color: #880088; }
  #SVGBG_UI #svgACTIONS {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    padding: 0 15px; }
    #SVGBG_UI #svgACTIONS button {
      display: block;
      padding: 15px 0;
      background: #FFF;
      color: #880088;
      transition: background .2s ease; }
      #SVGBG_UI #svgACTIONS button svg {
        display: block;
        width: 24px;
        height: 24px;
        margin: 0 auto;
        fill: none;
        stroke: #880088;
        stroke-width: 2px;
        stroke-linecap: round;
        stroke-linejoin: round; }
      #SVGBG_UI #svgACTIONS button:hover, #SVGBG_UI #svgACTIONS button:focus {
        background: #F8EFF8;
        outline: none; }

#controls {
  position: sticky;
  top: 0;
  left: 0;
  z-index: 99; }
  @media (min-width: 775px) {
    #controls {
      position: relative;
      padding: 15px; } }
  #controls .stickyControls .control-box {
    background: #FFF; }
    #controls .stickyControls .control-box.active {
      box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1); }
  @media (min-width: 775px) {
    #controls .stickyControls {
      position: sticky;
      top: 15px; } }
  #controls #svgName {
    padding: 20px 15px 5px 15px;
    border-bottom: 1px solid #EEE;
    display: none; }
    #controls #svgName h2 {
      margin: 0;
      font-size: 24px; }
    @media (min-width: 775px) {
      #controls #svgName {
        display: block; } }
  #controls #svgCustomize {
    padding: 15px;
    border-bottom: 1px solid #EEE; }
  #controls #set-details {
    overflow: hidden; }
  #controls #SVGBG_UI {
    overflow: hidden;
    max-height: 0; }
    #controls #SVGBG_UI.active {
      max-height: 9999px; }

h3 svg {
  display: inline-block;
  width: 16px;
  width: 1rem;
  height: 16px;
  height: 1rem; }

.svgIcon {
  fill: #AAA;
  fill: #C380C3;
  width: 32px;
  height: 32px;
  display: inline-block;
  vertical-align: middle; }

#stage {
  padding: 15px;
  display: block; }
  @media (min-width: 775px) {
    #stage {
      padding-right: 30px; } }
  @media (min-width: 1000px) {
    #stage {
      display: grid;
      grid-template-columns: repeat(auto-fit, 240px);
      justify-content: center;
      grid-gap: 60px; } }
  @media (min-width: 1200px) {
    #stage {
      grid-gap: 75px; } }
  @media (min-width: 1800px) {
    #stage {
      grid-gap: 90px; } }
  @media (min-width: 2050px) {
    #stage {
      max-width: 1680px;
      margin: 0 auto; } }
  #stage.stage-single {
    padding: 15px;
    display: block; }

#set-details {
  box-shadow: inset 0 1px 0 0 #F0DFF0;
  background: #FFF;
  padding: 15px;
  line-height: 1.2;
  font-size: 1.1rem; }
  @media (min-width: 660px) {
    #set-details {
      font-size: 1.2rem; } }
  @media (min-width: 1200px) {
    #set-details {
      font-size: 1.25rem; } }
  #set-details h1 {
    line-height: 1;
    font-size: 1.6rem;
    font-weight: bold;
    margin: 15px 0 10px; }
    @media (min-width: 660px) {
      #set-details h1 {
        font-size: 1.8rem; } }
    @media (min-width: 900px) {
      #set-details h1 {
        font-size: 2rem; } }
    @media (min-width: 1200px) {
      #set-details h1 {
        font-size: 2.4rem; } }
    @media (min-width: 900px) {
      #set-details h1 {
        margin: 30px 0 10px; } }
  #set-details .set-description {
    padding: 15px; }
  #set-details .set-premium {
    color: #880088;
    padding: 15px;
    background: #F8EFF8;
    text-align: center; }
    #set-details .set-premium p:last-child {
      margin: 0; }

button.bg-btn {
  position: relative;
  max-width: 240px;
  height: auto;
  margin: 30px auto;
  padding: 0;
  display: block;
  overflow: hidden;
  outline: none;
  border: none;
  border-radius: 50%;
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.1);
  transition: border-width .2s ease; }
  @media (min-width: 1000px) {
    button.bg-btn {
      margin: 0 auto; } }
  button.bg-btn .img-wrap {
    overflow: hidden;
    border-radius: 50%; }
  button.bg-btn img {
    position: relative;
    z-index: 1;
    border-radius: 50%;
    max-width: 100%;
    backface-visibility: hidden;
    pointer-events: none;
    transition: filter .2s ease, transform .2s ease, opacity .2s ease; }
  button.bg-btn .bg-css {
    display: none; }
  button.bg-btn .overlay {
    position: absolute;
    z-index: 5;
    border-radius: 50%;
    left: -2px;
    top: -2px;
    bottom: -2px;
    right: -2px;
    overflow: hidden;
    box-shadow: inset 0 0 0 10px #fff;
    color: #FFF;
    display: flex;
    justify-content: center;
    /* align horizontal */
    align-items: center;
    /* align vertical */
    transition: box-shadow .2s ease; }
    button.bg-btn .overlay p {
      font-size: 1.25rem;
      text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.2);
      text-shadow: 0px 0px 9px rgba(0, 0, 0, 0.1), 0px 0px 5px rgba(0, 0, 0, 0.2), 0px 0px 3px rgba(0, 0, 0, 0.3), 1px 1px 1px rgba(0, 0, 0, 0.4);
      font-weight: bold;
      opacity: 0;
      transition: opacity .2s ease; }
  button.bg-btn.premium {
    border-radius: 50% 50% 8% 50%; }
    button.bg-btn.premium .img-wrap, button.bg-btn.premium .overlay, button.bg-btn.premium img {
      border-radius: 50% 50% 8% 50%; }
    button.bg-btn.premium::after {
      content: '';
      position: absolute;
      z-index: 4;
      bottom: 2px;
      right: 2px;
      width: 80px;
      height: 80px;
      background-color: #880088;
      background-color: #505;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23f09f33' d='M12 6l4 6 5-4-2 10H5L3 8l5 4z'/%3E%3C/svg%3E");
      background-position: center;
      background-repeat: no-repeat;
      background-size: 40px;
      border-radius: 80% 0 8% 0;
      transition: background .2s ease, width .2s ease, height .2s ease; }
  button.bg-btn:hover, button.bg-btn:focus {
    outline: none; }
    button.bg-btn:hover img, button.bg-btn:focus img {
      filter: contrast(0.8) brightness(85%) blur(5px);
      transform: scale(1.15) rotate(2deg); }
    button.bg-btn:hover .overlay, button.bg-btn:focus .overlay {
      box-shadow: inset 0 0 0 18px #fff; }
      button.bg-btn:hover .overlay p, button.bg-btn:focus .overlay p {
        opacity: 1; }
    button.bg-btn:hover.premium::after, button.bg-btn:focus.premium::after {
      width: 60px;
      height: 60px;
      background-color: #FFF; }

.btn-SET {
  position: relative;
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1fr;
  margin-bottom: 30px;
  background: rgba(68, 0, 68, 0.8);
  border-radius: 15px;
  box-shadow: inset 0 0 0 1px #880088;
  text-decoration: none !important;
  transition: background .2s ease, box-shadow .2s ease; }
  @media (min-width: 1400px) {
    .btn-SET {
      grid-template-rows: 210px;
      grid-template-columns: minmax(320px, 420px) 1fr; } }
  @media (min-width: 1000px) {
    .btn-SET {
      margin-bottom: 0px; } }
  @media (min-width: 1400px) {
    .btn-SET {
      border-radius: 100px 15px 15px 100px; } }
  .btn-SET .thumbWrap {
    position: relative;
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    margin: -15px 0; }
    @media (min-width: 1400px) {
      .btn-SET .thumbWrap {
        margin: -15px 0 -15px -5px; } }
    .btn-SET .thumbWrap button.bg-btn {
      grid-column-end: span 4;
      grid-row: 1/2;
      grid-column-start: 1;
      z-index: 88;
      margin: 0 auto;
      width: 120px;
      height: 120px;
      pointer-events: none;
      transition: transform .2s ease; }
      @media (min-width: 1400px) {
        .btn-SET .thumbWrap button.bg-btn {
          width: 240px;
          height: 240px; } }
      .btn-SET .thumbWrap button.bg-btn:nth-of-type(2) {
        grid-column-start: 2;
        z-index: 87; }
      .btn-SET .thumbWrap button.bg-btn:nth-of-type(3) {
        grid-column-start: 3;
        z-index: 86; }
      .btn-SET .thumbWrap button.bg-btn:nth-of-type(4) {
        grid-column-start: 4;
        z-index: 85; }
  .btn-SET .titleWrap {
    padding: 30px 45px;
    text-align: center;
    align-self: center; }
    @media (min-width: 1400px) {
      .btn-SET .titleWrap {
        text-align: left; } }
    .btn-SET .titleWrap p {
      transition: transform .2s ease;
      line-height: 1; }
    .btn-SET .titleWrap p.button-title {
      font-size: 24px;
      color: #FFF;
      font-weight: bold; }
      @media (min-width: 660px) {
        .btn-SET .titleWrap p.button-title {
          font-size: 28px; } }
      @media (min-width: 900px) {
        .btn-SET .titleWrap p.button-title {
          font-size: 32px; } }
      @media (min-width: 1200px) {
        .btn-SET .titleWrap p.button-title {
          font-size: 36px; } }
      @media (min-width: 1400px) {
        .btn-SET .titleWrap p.button-title {
          font-size: 38px; } }
      @media (min-width: 1800px) {
        .btn-SET .titleWrap p.button-title {
          font-size: 42px; } }
    .btn-SET .titleWrap p.button-text {
      font-size: 1rem;
      color: #f09f33; }
  .btn-SET.premium-SET {
    position: relative; }
    .btn-SET.premium-SET::after {
      content: '';
      position: absolute;
      z-index: 4;
      bottom: -5px;
      right: -5px;
      width: 80px;
      height: 80px;
      background-color: #505;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23f09f33' d='M12 6l4 6 5-4-2 10H5L3 8l5 4z'/%3E%3C/svg%3E");
      background-position: 60% 60%;
      background-repeat: no-repeat;
      background-size: 40px;
      border-radius: 80% 0 8% 0;
      transition: background .2s ease, width .2s ease, height .2s ease; }
  .btn-SET:hover {
    background: #220022;
    box-shadow: inset 0 0 0 2px #FFF; }
    .btn-SET:hover .titleWrap p {
      transform: translateY(10px); }
      @media (min-width: 1400px) {
        .btn-SET:hover .titleWrap p {
          transform: translateX(30px); } }
    .btn-SET:hover .bg-btn {
      transform: translateX(-30px); }
      .btn-SET:hover .bg-btn:nth-of-type(2) {
        transform: translateX(-10px); }
      .btn-SET:hover .bg-btn:nth-of-type(3) {
        transform: translateX(10px); }
      .btn-SET:hover .bg-btn:nth-of-type(4) {
        transform: translateX(30px); }
    .btn-SET:hover::after {
      width: 60px;
      height: 60px;
      background-color: #FFF; }

.premium-header {
  color: #FFF;
  grid-column: 1 / -1;
  position: relative; }
  .premium-header h1, .premium-header h2 {
    font-size: 24px;
    line-height: 1;
    text-align: center;
    padding: 20px 30px;
    background: #880088; }
    @media (min-width: 660px) {
      .premium-header h1, .premium-header h2 {
        font-size: 28px;
        line-height: 1.5; } }
    @media (min-width: 775px) {
      .premium-header h1, .premium-header h2 {
        font-size: 32px;
        line-height: 1.4; } }
    @media (min-width: 900px) {
      .premium-header h1, .premium-header h2 {
        font-size: 36px;
        line-height: 1.2; } }
    @media (min-width: 1200px) {
      .premium-header h1, .premium-header h2 {
        font-size: 48px;
        line-height: 1; } }
  @media (min-width: 775px) {
    .premium-header {
      padding: 30px 75px 5px 75px; }
      .premium-header h1, .premium-header h2 {
        position: relative;
        min-height: 98px;
        color: #FFF;
        border-radius: 4px;
        box-shadow: inset 0 0 0 1px rgba(170, 32, 104, 0.5), inset 0 0 30px rgba(195, 128, 195, 0.5), 0 6px 25px rgba(0, 0, 0, 0.5); }
        .premium-header h1::before, .premium-header h1::after, .premium-header h2::before, .premium-header h2::after {
          content: '';
          position: absolute;
          z-index: -1;
          left: -86px;
          top: 40px;
          display: block;
          width: 115px;
          height: 0px;
          border: 49px solid #707;
          border-right: 30px solid #505;
          border-left-color: transparent;
          transform: rotate(-8deg);
          background: #707;
          clip-path: polygon(100% 0%, 100% 100%, 0 100%, 60% 45%, 0 0); }
        .premium-header h1::after, .premium-header h2::after {
          left: auto;
          right: -86px;
          border-left: 30px solid #505;
          border-right: 30px solid transparent;
          transform: rotate(5deg);
          clip-path: polygon(100% 0%, 40% 45%, 100% 100%, 0 100%, 0 0); } }

.cover {
  background-attachment: scroll !important;
  background-size: cover !important;
  background-position: center !important; }

.zoom {
  background-attachment: scroll !important;
  background-size: 200% !important;
  background-position: center !important; }

.full {
  background-size: 115% !important; }

.contain {
  background-size: 100% !important;
  background-attachment: scroll !important; }

.cover-left {
  background-attachment: scroll !important;
  background-size: cover !important;
  background-position: left !important; }

.cover-right {
  background-attachment: scroll !important;
  background-size: cover !important;
  background-position: right !important; }

.top {
  background-position: top !important; }

.bottom {
  background-position: bottom !important; }

.left {
  background-position: left !important; }

.right {
  background-position: right !important; }

#svgCustomize label {
  width: 25%;
  display: inline-block;
  padding: 5px 0;
  margin: 0; }

#svgCustomize input {
  width: 75%;
  line-height: 1.4rem; }

#svgCustomize .colr1 input {
  width: 100%; }

#svgCustomize .colr2 input {
  width: 50%; }

#svgCustomize .colr3 input, #svgCustomize .colr4 input, #svgCustomize .colr5 input, #svgCustomize .colr6 input, #svgCustomize .colr7 input, #svgCustomize .colr8 input, #svgCustomize .colr9 input {
  width: 33.3333333%; }

/*
#svgCustomize .filler{
    width:25%;
    padding:0;
    margin:0;
    color:#FFF;
    display:inline-block;
}*/
#svgCustomize .colr4 .colr4-6 input {
  width: 100% !important; }

#svgCustomize .colr5 .colr4-6 input {
  width: 50% !important; }

#svgCustomize .colr7 .colr7-9 input {
  width: 100% !important; }

#svgCustomize .colr8 .colr7-9 input {
  width: 50% !important; }

#svgCustomize .colr1 .colr4-6, #svgCustomize .colr1 .colr7-9, #svgCustomize .colr2 .colr4-6, #svgCustomize .colr2 .colr7-9, #svgCustomize .colr3 .colr4-6, #svgCustomize .colr3 .colr7-9 {
  display: none; }

#svgCustomize .colr4 .colr7-9, #svgCustomize .colr5 .colr7-9, #svgCustomize .colr6 .colr7-9 {
  display: none; }

#credits {
  font-size: 0.8rem;
  margin: 0;
  color: #999; }
  #credits a {
    color: #222; }
  #credits a:hover {
    color: #73B; }

.heading-text {
  width: 52%;
  display: inline-block; }

.heading-button {
  width: 48%;
  display: inline-block;
  text-align: right; }

#controls button {
  border: none; }

.btn {
  background: #FFF;
  color: #880088;
  border-radius: 50px;
  padding: 4px 10px;
  transition: color 1s, background 0.2s; }

.btn:hover {
  background: #F8EFF8;
  color: #000;
  text-decoration: none; }

.btn:focus {
  outline: none;
  box-shadow: inset 0 0 0 1px #CCC, inset 0 0 0 2px #FFF; }

.separator {
  color: #DDD; }

#custom-color {
  display: flex;
  margin: 4px 0 12px 0; }
  #custom-color #the_colors {
    display: block;
    width: 75%; }

/*.jscolor-picker-wrap{
	.jscolor-picker{
		.jscolor-palette{
			> div div{
				border-radius: 2px;
			}
		}
	}	
}*/
#svgCustomize label#color-lock-label {
  display: block;
  width: 16%; }

#color-lock-btn {
  display: block;
  width: 9%;
  height: 28px;
  margin: 0;
  padding: 0;
  align-items: center;
  background: #FFF;
  transition: background 0.2s, color 1s; }
  #color-lock-btn:hover, #color-lock-btn:focus {
    color: #73B;
    background: #EEE;
    background: #F8EFF8;
    outline: none; }
    #color-lock-btn:hover svg#padlock .shackle, #color-lock-btn:focus svg#padlock .shackle {
      fill: #777;
      fill: #880088; }
    #color-lock-btn:hover svg#padlock .lock-base, #color-lock-btn:focus svg#padlock .lock-base {
      fill: #777;
      fill: #880088; }
  #color-lock-btn svg#padlock {
    width: 12px;
    height: 18px;
    display: inline-block;
    vertical-align: middle;
    transform: translateY(-2px); }
    #color-lock-btn svg#padlock .shackle {
      fill: #CCC;
      fill: #C380C3;
      transition: fill 1s; }
    #color-lock-btn svg#padlock .lock-base {
      fill: #CCC;
      fill: #C380C3;
      transition: fill 1s; }

.locked .shackle {
  transform: translateY(3px);
  animation: lock 0.2s ease; }

@keyframes lock {
  0% {
    transform: translateY(0); }
  100% {
    transform: translateY(3px); } }
.unlocked .shackle {
  transform: translateY(0);
  animation: unlock 0.2s ease; }

@keyframes unlock {
  0% {
    transform: translateY(3px); }
  100% {
    transform: translateY(0); } }
.hiddenColor, .hiddenSliderInit {
  display: none; }

.showSlider {
  opacity: 1;
  height: 2.1rem;
  transform: translateX(0);
  animation: expand 0.2s ease-in-out; }

@keyframes expand {
  0% {
    opacity: 0;
    height: 0;
    transform: translateX(0); }
  50% {
    opacity: 0;
    height: 2rem;
    transform: translateX(0); }
  100% {
    opacity: 1;
    height: 2rem;
    transform: translateX(0); } }
.hideSlider {
  opacity: 0;
  height: 0px;
  transform: translateX(-1000px);
  animation: shrink 0.2s ease-in-out; }

@keyframes shrink {
  0% {
    opacity: 1;
    height: 2rem;
    transform: translateX(0); }
  50% {
    opacity: 0;
    height: 2rem;
    transform: translateX(0); }
  100% {
    opacity: 0;
    height: 0;
    transform: translateX(0); } }
input[type=text], input[type=password] {
  text-align: center;
  border: 1px solid #FFF;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1);
  cursor: pointer;
  padding: 5px 0;
  border-radius: 3px;
  text-transform: uppercase; }

input[type=text]:focus, input[type=password]:focus {
  outline: none;
  border: 1px solid #333;
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, 0.4), 0 0 0 3px #333;
  z-index: 999;
  position: relative; }

input[type=text]::selection, input[type=password]::selection {
  color: #FFF;
  background: #000; }

input[type=text]::-moz-selection, input[type=password]::-moz-selection {
  color: #FFF;
  background: #000; }

select {
  padding: 2px 6px;
  border: none;
  border-radius: 0 !important; }
  select option {
    background: #FFF; }
  select option:hover {
    background: #EEE; }

select:hover {
  background: #CCC; }

#uiDropdown {
  width: 100%;
  margin: 0 auto;
  position: relative; }

#dropdownBtn {
  position: relative;
  z-index: 1;
  width: 100%; }

#dropdownContent {
  position: absolute;
  top: 0;
  left: 0;
  box-shadow: 0px 4px 16px 0px rgba(0, 0, 0, 0.3), 0px 0px 0px 1px rgba(0, 0, 0, 0.05);
  z-index: 2; }
  #dropdownContent button {
    text-transform: uppercase;
    width: 100%;
    background: #EEE;
    color: #777;
    padding: 5px 0 5px 15px;
    font-size: 0.8rem;
    border-top: 1px solid #DDD;
    text-align: left;
    transition: color 1s, background 0.2s; }
  #dropdownContent button:hover {
    background: #FFF;
    color: #000; }
  #dropdownContent button:focus {
    outline: none;
    box-shadow: inset 0 0 0 1px #AAA, inset 0 0 0 2px #FFF; }
  #dropdownContent .dropdownSelection {
    background: #FFF;
    color: #73B; }

.showDropdown {
  display: block; }

.hideDropdown, .filterOut {
  display: none; }

textarea {
  font-size: 0.75rem;
  overflow-y: scroll;
  overflow-x: hidden; }

.blendBtn {
  width: 10% !important; }

.varyBtn {
  width: 55% !important; }

#blendMode, #varyMode {
  width: 55%;
  display: inline-block;
  text-align: center;
  margin: 0; }

input[type=button] {
  border: none;
  cursor: pointer;
  border-radius: 3px; }

.noselect {
  -webkit-touch-callout: none;
  /* iOS Safari */
  -webkit-user-select: none;
  /* Safari */
  -khtml-user-select: none;
  /* Konqueror HTML */
  -moz-user-select: none;
  /* Firefox */
  -ms-user-select: none;
  /* Internet Explorer/Edge */
  user-select: none;
  /* Non-prefixed version, currently
     supported by Chrome and Opera */ }

.hideUI {
  opacity: 0;
  animation: hide-UI 0.25s ease-in-out; }

@keyframes hide-UI {
  0% {
    opacity: 1; }
  100% {
    opacity: 0; } }
.showUI {
  opacity: 1;
  animation: show-UI 0.25s ease-in-out; }

@keyframes show-UI {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
/* <home> */
.welcome {
  color: #FFF;
  font-weight: 300; }
  .welcome br {
    display: none; }
    @media (min-width: 450px) {
      .welcome br {
        display: inline; } }
  .welcome h1 {
    font-weight: bold;
    line-height: 1.2;
    font-size: 2.2rem; }
    @media (min-width: 450px) {
      .welcome h1 {
        font-size: 2.5rem; } }
    @media (min-width: 775px) {
      .welcome h1 {
        font-size: 3rem; } }
    @media (min-width: 1200px) {
      .welcome h1 {
        font-size: 3.5rem; } }
    @media (min-width: 1800px) {
      .welcome h1 {
        font-size: 4rem; } }
  .welcome .welcome-description {
    padding: 30px 15px;
    text-align: center;
    background-color: #330033;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1600 800'%3E%3Cg fill-opacity='0.5'%3E%3Cpath fill='%23330033' d='M486 705.8c-109.3-21.8-223.4-32.2-335.3-19.4C99.5 692.1 49 703 0 719.8V800h843.8c-115.9-33.2-230.8-68.1-347.6-92.2C492.8 707.1 489.4 706.5 486 705.8z'/%3E%3Cpath fill='%23330033' d='M1600 0H0v719.8c49-16.8 99.5-27.8 150.7-33.5c111.9-12.7 226-2.4 335.3 19.4c3.4 0.7 6.8 1.4 10.2 2c116.8 24 231.7 59 347.6 92.2H1600V0z'/%3E%3Cpath fill='%23330033' d='M478.4 581c3.2 0.8 6.4 1.7 9.5 2.5c196.2 52.5 388.7 133.5 593.5 176.6c174.2 36.6 349.5 29.2 518.6-10.2V0H0v574.9c52.3-17.6 106.5-27.7 161.1-30.9C268.4 537.4 375.7 554.2 478.4 581z'/%3E%3Cpath fill='%23330033' d='M0 0v429.4c55.6-18.4 113.5-27.3 171.4-27.7c102.8-0.8 203.2 22.7 299.3 54.5c3 1 5.9 2 8.9 3c183.6 62 365.7 146.1 562.4 192.1c186.7 43.7 376.3 34.4 557.9-12.6V0H0z'/%3E%3Cpath fill='%23330033' d='M181.8 259.4c98.2 6 191.9 35.2 281.3 72.1c2.8 1.1 5.5 2.3 8.3 3.4c171 71.6 342.7 158.5 531.3 207.7c198.8 51.8 403.4 40.8 597.3-14.8V0H0v283.2C59 263.6 120.6 255.7 181.8 259.4z'/%3E%3Cpath fill='%233a003a' d='M1600 0H0v136.3c62.3-20.9 127.7-27.5 192.2-19.2c93.6 12.1 180.5 47.7 263.3 89.6c2.6 1.3 5.1 2.6 7.7 3.9c158.4 81.1 319.7 170.9 500.3 223.2c210.5 61 430.8 49 636.6-16.6V0z'/%3E%3Cpath fill='%23400040' d='M454.9 86.3C600.7 177 751.6 269.3 924.1 325c208.6 67.4 431.3 60.8 637.9-5.3c12.8-4.1 25.4-8.4 38.1-12.9V0H288.1c56 21.3 108.7 50.6 159.7 82C450.2 83.4 452.5 84.9 454.9 86.3z'/%3E%3Cpath fill='%23470047' d='M1600 0H498c118.1 85.8 243.5 164.5 386.8 216.2c191.8 69.2 400 74.7 595 21.1c40.8-11.2 81.1-25.2 120.3-41.7V0z'/%3E%3Cpath fill='%234e004e' d='M1397.5 154.8c47.2-10.6 93.6-25.3 138.6-43.8c21.7-8.9 43-18.8 63.9-29.5V0H643.4c62.9 41.7 129.7 78.2 202.1 107.4C1020.4 178.1 1214.2 196.1 1397.5 154.8z'/%3E%3Cpath fill='%23550055' d='M1315.3 72.4c75.3-12.6 148.9-37.1 216.8-72.4h-723C966.8 71 1144.7 101 1315.3 72.4z'/%3E%3C/g%3E%3C/svg%3E");
    background-attachment: fixed;
    background-size: cover;
    background-position: center; }
    @media (min-width: 660px) {
      .welcome .welcome-description {
        padding: 120px 30px 30px 30px; } }
    .welcome .welcome-description p {
      color: #DAB0DA;
      line-height: 1.4;
      font-size: 1.5rem; }
      @media (min-width: 450px) {
        .welcome .welcome-description p {
          font-size: 1.6rem; } }
      @media (min-width: 775px) {
        .welcome .welcome-description p {
          font-size: 1.8rem; } }
      @media (min-width: 1200px) {
        .welcome .welcome-description p {
          font-size: 2rem; } }
      @media (min-width: 1800px) {
        .welcome .welcome-description p {
          font-size: 2.2rem; } }

#demo {
  height: 50vh;
  min-height: 360px;
  padding-top: 30px; }
  #demo #tryMe {
    margin: 0 auto;
    max-width: 600px;
    position: relative;
    top: 0;
    left: 0; }
    #demo #tryMe #tryMeArrow {
      position: absolute;
      top: 75px;
      left: 0;
      z-index: 99;
      transform: rotate(5deg) translate(-5px, 0) scale(1);
      animation: floatingArrow 2s ease-in-out infinite;
      animation-iteration-count: 5;
      animation-delay: 5s; }
    #demo #tryMe img {
      width: 200px;
      height: 100px; }

@keyframes floatingArrow {
  0% {
    transform: translate(-5px, 0) rotate(5deg) scale(1); }
  50% {
    transform: translate(10px, 15px) rotate(10deg) scale(1); }
  100% {
    transform: translate(-5px, 0) rotate(5deg) scale(1); } }
#section-optimize h2 {
  text-align: center; }

/*  </home>  */
/*  <page elements>  */
.text-block {
  background: #FFF;
  color: #202;
  padding: 30px;
  margin: 15px 0 30px 0; }
  @media (min-width: 660px) {
    .text-block {
      padding: 30px 60px;
      margin: 30px 15px; } }
  @media (min-width: 1200px) {
    .text-block {
      padding: 60px 120px;
      margin: 60px 15px; } }

ul.category-grid {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 20px;
  padding: 0;
  list-style: none; }
  @media (min-width: 775px) {
    ul.category-grid {
      grid-template-columns: 1fr 1fr;
      grid-gap: 30px; } }
  @media (min-width: 1200px) {
    ul.category-grid {
      grid-template-columns: 1fr 1fr 1fr; } }
  ul.category-grid a {
    display: grid;
    grid-template-columns: 24px 1fr;
    grid-gap: 8px;
    padding: 8px;
    backface-visibility: hidden;
    /* prevent flickering */
    border-radius: 5px;
    background: #FFF;
    transition: box-shadow .2s ease, transform .2s ease, color .2s ease; }
    @media (min-width: 660px) {
      ul.category-grid a {
        grid-template-columns: 48px 1fr;
        grid-gap: 15px;
        padding: 15px; } }
    ul.category-grid a svg {
      display: block;
      width: 24px;
      fill: #880088;
      transition: fill .2s ease, transform .2s ease; }
      @media (min-width: 660px) {
        ul.category-grid a svg {
          width: 48px; } }
    ul.category-grid a:hover {
      box-shadow: inset 0 -8px 0 0 #C380C3, inset 0 -78px 0 0 #F8EFF8;
      text-decoration: none;
      transform: translateY(-5px);
      color: #404; }
      ul.category-grid a:hover svg {
        fill: #f09f33;
        transform: scale(1.5); }
  ul.category-grid p {
    line-height: 24px;
    margin: 0;
    font-weight: bold; }
    @media (min-width: 775px) {
      ul.category-grid p {
        line-height: 48px; } }

.card-grid {
  display: grid;
  grid-template-columns: 1fr;
  grid-gap: 30px; }
  @media (min-width: 900px) {
    .card-grid {
      grid-template-columns: 1fr 1fr; } }
  .card-grid a {
    overflow: hidden;
    display: grid;
    grid-template-columns: 78px 1fr;
    grid-gap: 15px;
    border-radius: 5px;
    background: #FFF;
    transition: background .2s ease, transform .2s ease, color .2s ease; }
    .card-grid a .svg-wrap {
      background: #F8EFF8;
      padding: 15px;
      transition: fill .2s ease, background .2s ease; }
    .card-grid a svg {
      display: block;
      width: 48px;
      fill: none;
      stroke: #880088;
      stroke-width: 1.5;
      stroke-linecap: round;
      stroke-linejoin: round;
      transition: fill .2s ease, transform .2s ease, background .2s ease; }
    .card-grid a .content-wrap {
      padding: 15px; }
    .card-grid a:hover {
      color: #404;
      text-decoration: none;
      transform: translateY(-5px);
      background: #F8EFF8; }
      .card-grid a:hover .svg-wrap {
        background: #F0DFF0; }
      .card-grid a:hover svg {
        stroke: #cc3f47;
        transform: scale(1.2); }
  .card-grid p {
    line-height: 48px;
    margin: 0;
    font-weight: bold; }

/*  </page elements>   */
/*  <subscribe page>   */
.section-pad {
  padding: 60px 20px 40px 20px; }
  @media (min-width: 660px) {
    .section-pad {
      padding: 60px 30px; } }
  @media (min-width: 900px) {
    .section-pad {
      padding: 20px 40px; } }
  @media (min-width: 1200px) {
    .section-pad {
      padding: 60px 60px; } }

p.boost {
  font-size: 1.3rem; }
  @media (min-width: 450px) {
    p.boost {
      font-size: 1.4rem; } }
  @media (min-width: 660px) {
    p.boost {
      font-size: 1.5rem; } }
  @media (min-width: 900px) {
    p.boost {
      font-size: 1.6rem; } }
  @media (min-width: 1200px) {
    p.boost {
      font-size: 1.7rem; } }
  @media (min-width: 1400px) {
    p.boost {
      font-size: 1.8rem; } }

#section-subscribe, .LP {
  background: #FFF; }
  #section-subscribe h2, .LP h2 {
    font-size: 24px;
    color: #404; }
    @media (min-width: 450px) {
      #section-subscribe h2, .LP h2 {
        font-size: 27px; } }
    @media (min-width: 660px) {
      #section-subscribe h2, .LP h2 {
        font-size: 32px; } }
    @media (min-width: 900px) {
      #section-subscribe h2, .LP h2 {
        font-size: 36px; } }
    @media (min-width: 1200px) {
      #section-subscribe h2, .LP h2 {
        font-size: 44px; } }
    @media (min-width: 1400px) {
      #section-subscribe h2, .LP h2 {
        font-size: 48px; } }

#section-subscribe #subscribe-hero, #section-subscribe .section-CTA {
  background-color: #303;
  text-align: center; }
  #section-subscribe #subscribe-hero h1, #section-subscribe #subscribe-hero h2, #section-subscribe .section-CTA h1, #section-subscribe .section-CTA h2 {
    color: #FFF; }
    #section-subscribe #subscribe-hero h1.d-emph, #section-subscribe #subscribe-hero h2.d-emph, #section-subscribe .section-CTA h1.d-emph, #section-subscribe .section-CTA h2.d-emph {
      color: #DAB0DA; }
  #section-subscribe #subscribe-hero p, #section-subscribe .section-CTA p {
    color: #DAB0DA; }
  #section-subscribe #subscribe-hero a, #section-subscribe .section-CTA a {
    margin-top: 30px; }
#section-subscribe #subscribe-hero {
  display: flex;
  justify-content: center;
  min-height: 250px;
  background-color: #404;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' width='100%25' height='100' viewBox='0 0 1600 130'%3E%3Cpath d='M1600 130H0V20c400 0 400 100 800 100s400-100 800-100v110z' fill='%23FFF'/%3E%3ClinearGradient id='bg' gradientUnits='userSpaceOnUse' x1='0' y1='60' x2='1600' y2='60'%3E%3Cstop offset='0' stop-color='%23808'/%3E%3Cstop offset='.5' stop-color='%23CC3F47'/%3E%3Cstop offset='1' stop-color='%23F09F33'/%3E%3C/linearGradient%3E%3Cpath d='M0 10c400 0 400 100 800 100s400-100 800-100' fill='none' stroke='url(%23bg)' stroke-width='5'/%3E%3C/svg%3E"), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2000 1500'%3E%3Cdefs%3E%3CradialGradient id='a' gradientUnits='objectBoundingBox'%3E%3Cstop offset='0' stop-color='%23660066'/%3E%3Cstop offset='1' stop-color='%23440044'/%3E%3C/radialGradient%3E%3ClinearGradient id='b' gradientUnits='userSpaceOnUse' x1='0' y1='750' x2='1550' y2='750'%3E%3Cstop offset='0' stop-color='%23550055'/%3E%3Cstop offset='1' stop-color='%23440044'/%3E%3C/linearGradient%3E%3Cpath id='s' fill='url(%23b)' d='M1549.2 51.6c-5.4 99.1-20.2 197.6-44.2 293.6c-24.1 96-57.4 189.4-99.3 278.6c-41.9 89.2-92.4 174.1-150.3 253.3c-58 79.2-123.4 152.6-195.1 219c-71.7 66.4-149.6 125.8-232.2 177.2c-82.7 51.4-170.1 94.7-260.7 129.1c-90.6 34.4-184.4 60-279.5 76.3C192.6 1495 96.1 1502 0 1500c96.1-2.1 191.8-13.3 285.4-33.6c93.6-20.2 185-49.5 272.5-87.2c87.6-37.7 171.3-83.8 249.6-137.3c78.4-53.5 151.5-114.5 217.9-181.7c66.5-67.2 126.4-140.7 178.6-218.9c52.3-78.3 96.9-161.4 133-247.9c36.1-86.5 63.8-176.2 82.6-267.6c18.8-91.4 28.6-184.4 29.6-277.4c0.3-27.6 23.2-48.7 50.8-48.4s49.5 21.8 49.2 49.5c0 0.7 0 1.3-0.1 2L1549.2 51.6z'/%3E%3Cg id='g'%3E%3Cuse href='%23s' transform='scale(0.12) rotate(60)'/%3E%3Cuse href='%23s' transform='scale(0.2) rotate(10)'/%3E%3Cuse href='%23s' transform='scale(0.25) rotate(40)'/%3E%3Cuse href='%23s' transform='scale(0.3) rotate(-20)'/%3E%3Cuse href='%23s' transform='scale(0.4) rotate(-30)'/%3E%3Cuse href='%23s' transform='scale(0.5) rotate(20)'/%3E%3Cuse href='%23s' transform='scale(0.6) rotate(60)'/%3E%3Cuse href='%23s' transform='scale(0.7) rotate(10)'/%3E%3Cuse href='%23s' transform='scale(0.835) rotate(-40)'/%3E%3Cuse href='%23s' transform='scale(0.9) rotate(40)'/%3E%3Cuse href='%23s' transform='scale(1.05) rotate(25)'/%3E%3Cuse href='%23s' transform='scale(1.2) rotate(8)'/%3E%3Cuse href='%23s' transform='scale(1.333) rotate(-60)'/%3E%3Cuse href='%23s' transform='scale(1.45) rotate(-30)'/%3E%3Cuse href='%23s' transform='scale(1.6) rotate(10)'/%3E%3C/g%3E%3C/defs%3E%3Cg transform='rotate(0 0 0)'%3E%3Cg transform='rotate(0 0 0)'%3E%3Ccircle fill='url(%23a)' r='3000'/%3E%3Cg opacity='0.5'%3E%3Ccircle fill='url(%23a)' r='2000'/%3E%3Ccircle fill='url(%23a)' r='1800'/%3E%3Ccircle fill='url(%23a)' r='1700'/%3E%3Ccircle fill='url(%23a)' r='1651'/%3E%3Ccircle fill='url(%23a)' r='1450'/%3E%3Ccircle fill='url(%23a)' r='1250'/%3E%3Ccircle fill='url(%23a)' r='1175'/%3E%3Ccircle fill='url(%23a)' r='900'/%3E%3Ccircle fill='url(%23a)' r='750'/%3E%3Ccircle fill='url(%23a)' r='500'/%3E%3Ccircle fill='url(%23a)' r='380'/%3E%3Ccircle fill='url(%23a)' r='250'/%3E%3C/g%3E%3Cg transform='rotate(0 0 0)'%3E%3Cuse href='%23g' transform='rotate(10)'/%3E%3Cuse href='%23g' transform='rotate(120)'/%3E%3Cuse href='%23g' transform='rotate(240)'/%3E%3C/g%3E%3Ccircle fill-opacity='0.1' fill='url(%23a)' r='3000'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  background-size: 100% 50px, cover;
  background-position: bottom center, center;
  background-repeat: no-repeat;
  padding-bottom: 50px; }
  #section-subscribe #subscribe-hero h1 {
    font-size: 32px; }
    @media (min-width: 450px) {
      #section-subscribe #subscribe-hero h1 {
        font-size: 36px; } }
    @media (min-width: 660px) {
      #section-subscribe #subscribe-hero h1 {
        font-size: 40px; } }
    @media (min-width: 900px) {
      #section-subscribe #subscribe-hero h1 {
        font-size: 48px; } }
    @media (min-width: 1200px) {
      #section-subscribe #subscribe-hero h1 {
        font-size: 56px; } }
  @media (min-width: 660px) {
    #section-subscribe #subscribe-hero {
      min-height: 300px; } }
  @media (min-width: 1200px) {
    #section-subscribe #subscribe-hero {
      min-height: 350px; } }
  #section-subscribe #subscribe-hero .section-wrap {
    align-self: center; }
  @media (min-width: 660px) {
    #section-subscribe #subscribe-hero {
      background-size: 100% 100px, cover; } }

#DEMO-VIDEO {
  max-width: 1280px;
  max-height: 720px;
  margin: 0 auto; }
  #DEMO-VIDEO video {
    border-radius: 20px;
    width: 100% !important;
    height: auto !important; }

#section-workflow h2 {
  text-align: center; }

.section-centered {
  text-align: center; }

.icon-buttons {
  display: flex;
  justify-content: center;
  flex-wrap: wrap; }
  .icon-buttons:hover a {
    color: #AAA; }
    .icon-buttons:hover a svg .hover {
      fill: #AAA; }
    .icon-buttons:hover a svg .hover-white {
      fill: #FFF; }
  .icon-buttons a {
    display: inline-block;
    padding: 15px;
    border-radius: 10px;
    text-align: center;
    color: #202;
    transition: color .2s ease, background .2s ease; }
    .icon-buttons a svg {
      display: inline-block;
      width: 100px;
      heigh: 100px; }
      .icon-buttons a svg * {
        transition: fill .2s ease; }
    .icon-buttons a p {
      margin: 0; }
    .icon-buttons a:hover {
      color: #880088;
      background: #F8EFF8;
      text-decoration: none; }
      .icon-buttons a:hover svg .hover {
        fill: #880088; }
      .icon-buttons a:hover svg .hover-white {
        fill: #F8EFF8; }

.icon-boxes {
  display: grid;
  grid-gap: 30px;
  padding: 15px 0;
  max-width: 1400px;
  margin: 0 auto; }
  @media (min-width: 660px) {
    .icon-boxes {
      grid-gap: 30px;
      padding: 30px 0; } }
  @media (min-width: 1200px) {
    .icon-boxes {
      grid-template-columns: 1fr 1fr; } }
  @media (min-width: 1400px) {
    .icon-boxes {
      grid-gap: 60px;
      padding: 60px 0; } }

.icon-box {
  display: grid;
  grid-gap: 15px;
  padding: 20px;
  background: #F8EFF8;
  border-radius: 10px;
  align-items: center;
  max-width: 660px;
  margin: 0 auto; }
  @media (min-width: 450px) {
    .icon-box {
      grid-template-columns: 48px 1fr;
      grid-gap: 15px;
      padding: 20px; } }
  @media (min-width: 660px) {
    .icon-box {
      grid-template-columns: 72px 1fr; } }
  @media (min-width: 775px) {
    .icon-box {
      grid-template-columns: 96px 1fr;
      grid-gap: 24px;
      padding: 30px; } }
  .icon-box h2, .icon-box h3 {
    color: #880088;
    font-weight: bold; }
  .icon-box p {
    margin: 0; }
  .icon-box svg {
    max-width: 48px;
    display: block;
    fill: #404; }
    @media (min-width: 450px) {
      .icon-box svg {
        max-width: 96px; } }
    .icon-box svg .splash {
      fill: #cc3f47; }

#section-bottom-cta {
  background: #404;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' width='100%25' height='100' viewBox='0 0 1600 130'%3E%3Cpath d='M1600 130H0V20c400 0 400 100 800 100s400-100 800-100v110z' fill='%23FFF'/%3E%3ClinearGradient id='bg' gradientUnits='userSpaceOnUse' x1='0' y1='60' x2='1600' y2='60'%3E%3Cstop offset='0' stop-color='%23808'/%3E%3Cstop offset='.5' stop-color='%23CC3F47'/%3E%3Cstop offset='1' stop-color='%23F09F33'/%3E%3C/linearGradient%3E%3Cpath d='M0 10c400 0 400 100 800 100s400-100 800-100' fill='none' stroke='url(%23bg)' stroke-width='5'/%3E%3C/svg%3E"), linear-gradient(#404, #404);
  background-repeat: no-repeat;
  background-size: 100% 50px, 100%;
  background-position: bottom center, 50%;
  padding: 0 0 50px 0; }
  @media (min-width: 660px) {
    #section-bottom-cta {
      background-size: 100% 100px, 100%;
      padding: 0 0 100px 0; } }
  #section-bottom-cta h2 {
    color: #FFF; }
  #section-bottom-cta p {
    color: #DAB0DA; }
  #section-bottom-cta a {
    margin: 12px 0; }
  #section-bottom-cta .section-wrap {
    padding: 60px 30px;
    align-items: center; }
    @media (min-width: 775px) {
      #section-bottom-cta .section-wrap {
        display: grid;
        grid-template-columns: 2fr 1fr;
        grid-gap: 30px;
        max-width: 900px;
        margin: 0 auto; } }
    @media (min-width: 1200px) {
      #section-bottom-cta .section-wrap {
        max-width: 1000px;
        padding: 60px 30px; } }
    #section-bottom-cta .section-wrap div {
      max-width: 450px;
      margin: 0 auto; }
      @media (min-width: 775px) {
        #section-bottom-cta .section-wrap div {
          max-width: 750px; } }

#section-icon-row {
  padding-bottom: 15px; }
  @media (min-width: 660px) {
    #section-icon-row {
      padding-bottom: 30px; } }
  @media (min-width: 1200px) {
    #section-icon-row {
      padding-bottom: 60px; } }
  #section-icon-row .section-wrap {
    padding: 10px; }
    @media (min-width: 450px) {
      #section-icon-row .section-wrap {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        grid-gap: 15px; } }
    @media (min-width: 660px) {
      #section-icon-row .section-wrap {
        padding: 15px; } }
    @media (min-width: 1200px) {
      #section-icon-row .section-wrap {
        grid-gap: 30px;
        max-width: 840px;
        margin: 0 auto; } }
  #section-icon-row p {
    font-weight: bold;
    color: #880088;
    font-size: 1rem; }
    @media (min-width: 660px) {
      #section-icon-row p {
        font-size: 1.125rem; } }
    @media (min-width: 1200px) {
      #section-icon-row p {
        font-size: 1.25rem; } }
  #section-icon-row svg {
    width: 48px;
    height: 48px;
    display: inline-block;
    fill: #404; }
    @media (min-width: 450px) {
      #section-icon-row svg {
        width: 64px;
        height: 64px; } }
    @media (min-width: 660px) {
      #section-icon-row svg {
        width: 72px;
        height: 72px; } }
    @media (min-width: 1200px) {
      #section-icon-row svg {
        width: 96px;
        height: 96px; } }
    #section-icon-row svg .splash {
      fill: #cc3f47; }

#section-superpowers h2 {
  text-align: center; }
#section-superpowers .section-wrap {
  padding: 15px 0;
  max-width: 1400px;
  margin: 0 auto; }
  @media (min-width: 900px) {
    #section-superpowers .section-wrap {
      display: grid;
      grid-template-columns: 1fr 1fr; } }
  @media (min-width: 660px) {
    #section-superpowers .section-wrap {
      grid-gap: 30px;
      padding: 30px 0; } }
  @media (min-width: 1200px) {
    #section-superpowers .section-wrap {
      grid-template-columns: 1fr 1fr; } }
  @media (min-width: 1400px) {
    #section-superpowers .section-wrap {
      grid-gap: 60px;
      padding: 60px 0; } }
  #section-superpowers .section-wrap h3 {
    color: #880088; }
  #section-superpowers .section-wrap .button-box {
    padding: 30px;
    max-width: 600px;
    margin: 30px auto;
    border-radius: 10px; }
    @media (min-width: 775px) {
      #section-superpowers .section-wrap .button-box {
        padding: 60px; } }
    @media (min-width: 1400px) {
      #section-superpowers .section-wrap .button-box {
        padding: 60px 120px;
        max-width: 700px; } }

.button-box {
  border: 3px #F8EFF8;
  border-style: solid solid dotted solid; }

.outline-pro {
  border-color: #C380C3;
  background-color: #FFF;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 2000 1200'%3E%3Cpath fill='none' stroke='%23F8EFF8' stroke-width='128' d='M0 0v5000M0 0l312.5 4687.5M0 0l625 4375M0 0l937.5 4062.5M0 0l1250 3750M0 0l1562.5 3437.5M0 0l1875 3125M0 0l2187.5 2812.5M0 0l2500 2500M0 0l2812.5 2187.5M0 0l3125 1875M0 0l3437.5 1562.5M0 0l3750 1250M0 0l4062.5 937.5M0 0l4375 625M0 0l4687.5 312.5M0 0h5000'/%3E%3C/svg%3E");
  background-size: cover;
  box-shadow: inset 0 1px 0 2px #FFF; }

#section-stock-graphics {
  background-color: #303;
  background: #303;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' width='100%25' height='100' viewBox='0 0 1600 130'%3E%3Cpath d='M0 0h1600v110c-400 0-400-100-800-100S400 110 0 110V0z' fill='%23FFF'/%3E%3ClinearGradient id='g' gradientUnits='userSpaceOnUse' x1='0' y1='70' x2='1600' y2='70'%3E%3Cstop offset='0' stop-color='%23808'/%3E%3Cstop offset='.5' stop-color='%23CC3F47'/%3E%3Cstop offset='1' stop-color='%23F09F33'/%3E%3C/linearGradient%3E%3Cpath d='M1600 120c-400 0-400-100-800-100S400 120 0 120' fill='none' stroke='url(%23g)' stroke-width='5'/%3E%3C/svg%3E"), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' width='100%25' height='100' viewBox='0 0 1600 130'%3E%3Cpath d='M1600 130H0V20c400 0 400 100 800 100s400-100 800-100v110z' fill='%23FFF'/%3E%3ClinearGradient id='bg' gradientUnits='userSpaceOnUse' x1='0' y1='60' x2='1600' y2='60'%3E%3Cstop offset='0' stop-color='%23808'/%3E%3Cstop offset='.5' stop-color='%23CC3F47'/%3E%3Cstop offset='1' stop-color='%23F09F33'/%3E%3C/linearGradient%3E%3Cpath d='M0 10c400 0 400 100 800 100s400-100 800-100' fill='none' stroke='url(%23bg)' stroke-width='5'/%3E%3C/svg%3E"), linear-gradient(#404, #404);
  background-repeat: no-repeat;
  background-size: 100% 50px, 100% 50px, 100%;
  background-position: top center, bottom center, 50%;
  padding: 50px 0; }
  @media (min-width: 660px) {
    #section-stock-graphics {
      background-size: 100% 100px, 100% 100px, 100%;
      padding: 100px 0; } }
  #section-stock-graphics .section-wrap {
    padding: 45px 30px;
    margin: 0 auto; }
    @media (min-width: 1200px) {
      #section-stock-graphics .section-wrap {
        display: grid;
        justify-content: center;
        align-items: center;
        grid-template-columns: 1fr 1fr;
        max-width: 900px; } }
    @media (min-width: 1400px) {
      #section-stock-graphics .section-wrap {
        padding: 60px 0;
        max-width: 1000px; } }
    #section-stock-graphics .section-wrap h2, #section-stock-graphics .section-wrap ul {
      color: #FFF; }
    #section-stock-graphics .section-wrap ul {
      padding-left: 30px; }
      @media (min-width: 1200px) {
        #section-stock-graphics .section-wrap ul {
          padding-left: 15px; } }
    #section-stock-graphics .section-wrap p {
      color: #DAB0DA; }
  #section-stock-graphics .junk-box {
    max-width: 600px;
    margin: 0 auto;
    padding: 0; }
    @media (min-width: 1200px) {
      #section-stock-graphics .junk-box {
        padding: 30px 0;
        max-width: 450px; } }
    @media (min-width: 1800px) {
      #section-stock-graphics .junk-box {
        padding: 60px;
        max-width: 550px; } }
  #section-stock-graphics ul {
    margin: 0; }
    #section-stock-graphics ul li {
      margin: 0;
      padding: 12px 15px 18px 50px;
      list-style: none;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 57 57'%3E%3Cpath fill='%23CC3F47' d='M48.7 8.3C37.5-2.8 19.5-2.8 8.3 8.3s-11.1 29.2 0 40.3 29.2 11.1 40.3 0 11.2-29.1.1-40.3zm-35.4 5C20.8 5.7 32.6 5 41 11L11 41c-6-8.4-5.3-20.2 2.3-27.7zm30.4 30.4C36.2 51.3 24.4 52 16 46l30-30c6 8.4 5.3 20.2-2.3 27.7z'/%3E%3C/svg%3E");
      background-position: left center;
      background-repeat: no-repeat;
      background-size: 36px;
      font-size: 1.25rem; }
      @media (min-width: 660px) {
        #section-stock-graphics ul li {
          font-size: 1.4rem; } }
      @media (min-width: 1200px) {
        #section-stock-graphics ul li {
          font-size: 1.5rem; } }
      @media (min-width: 1800px) {
        #section-stock-graphics ul li {
          font-size: 1.6rem; } }

#section-value-packed {
  background-color: #303;
  background: #303;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' width='100%25' height='100' viewBox='0 0 1600 130'%3E%3Cpath d='M0 0h1600v110c-400 0-400-100-800-100S400 110 0 110V0z' fill='%23FFF'/%3E%3ClinearGradient id='g' gradientUnits='userSpaceOnUse' x1='0' y1='70' x2='1600' y2='70'%3E%3Cstop offset='0' stop-color='%23808'/%3E%3Cstop offset='.5' stop-color='%23CC3F47'/%3E%3Cstop offset='1' stop-color='%23F09F33'/%3E%3C/linearGradient%3E%3Cpath d='M1600 120c-400 0-400-100-800-100S400 120 0 120' fill='none' stroke='url(%23g)' stroke-width='5'/%3E%3C/svg%3E"), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' width='100%25' height='100' viewBox='0 0 1600 130'%3E%3Cpath d='M1600 130H0V20c400 0 400 100 800 100s400-100 800-100v110z' fill='%23FFF'/%3E%3ClinearGradient id='bg' gradientUnits='userSpaceOnUse' x1='0' y1='60' x2='1600' y2='60'%3E%3Cstop offset='0' stop-color='%23808'/%3E%3Cstop offset='.5' stop-color='%23CC3F47'/%3E%3Cstop offset='1' stop-color='%23F09F33'/%3E%3C/linearGradient%3E%3Cpath d='M0 10c400 0 400 100 800 100s400-100 800-100' fill='none' stroke='url(%23bg)' stroke-width='5'/%3E%3C/svg%3E"), linear-gradient(#303, #303);
  background-repeat: no-repeat;
  background-size: 100% 50px, 100% 50px, 100%;
  background-position: top center, bottom center, 50%;
  padding: 50px 0; }
  @media (min-width: 660px) {
    #section-value-packed {
      background-size: 100% 100px, 100% 100px, 100%;
      padding: 100px 0; } }
  #section-value-packed .section-wrap {
    display: grid;
    align-items: center;
    max-width: 1400px;
    margin: 0 auto; }
    @media (min-width: 1200px) {
      #section-value-packed .section-wrap {
        grid-template-columns: 1fr 1fr;
        grid-gap: 30px; } }
    @media (min-width: 1800px) {
      #section-value-packed .section-wrap {
        grid-template-columns: 1fr 1fr;
        grid-gap: 60px; } }
  #section-value-packed .heading-stack {
    text-align: center;
    padding: 30px 0; }
    #section-value-packed .heading-stack h2 {
      color: #FFF; }
  #section-value-packed .icon-stack {
    display: grid;
    grid-gap: 60px; }
    @media (min-width: 1800px) {
      #section-value-packed .icon-stack .icon-box:nth-child(2) {
        transform: translateX(40px); } }

svg#prism {
  display: block;
  width: 100%;
  max-width: 150px;
  margin: 20px auto; }

#PRICES {
  position: relative;
  padding: 60px 15px; }
  @media (min-width: 660px) {
    #PRICES {
      padding: 90px 60px; } }
  @media (min-width: 1200px) {
    #PRICES {
      padding: 120px 60px; } }
  #PRICES svg.the-crown {
    position: absolute;
    top: -80px;
    left: 50%;
    background: #880088;
    border-radius: 99px;
    padding: 20px;
    width: 120px;
    height: 120px;
    transform: translateX(-60px);
    box-shadow: inset 0 0 0 4px #505;
    border: solid #cc3f47 4px; }
  @media (min-width: 1200px) {
    #PRICES {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='100 0 2200 250'%3E%3ClinearGradient id='a' x1='0' x2='0' y1='0' y2='1'%3E%3Cstop offset='0' stop-color='%23CC3F47'/%3E%3Cstop offset='1' stop-color='%23F09F33'/%3E%3C/linearGradient%3E%3Cg stroke='url(%23a)' opacity='.2' fill='none' stroke-width='2'%3E%3Ccircle cx='100' cy='125' r='100'/%3E%3Cpath d='M2354 152 2186 31l-21 195z'/%3E%3C/g%3E%3C/svg%3E");
      background-size: contain;
      background-position: center;
      background-repeat: no-repeat; } }
  #PRICES .section-wrap {
    max-width: 900px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 1fr;
    grid-gap: 0; }
    @media (min-width: 900px) {
      #PRICES .section-wrap {
        grid-template-columns: 1fr 1fr;
        grid-gap: 30px; } }
  #PRICES .price-card {
    position: relative;
    margin-bottom: 30px;
    padding: 30px 15px;
    font-size: 1.2rem;
    background: #F8EFF8;
    border-radius: 15px;
    text-align: center; }
    @media (min-width: 1260px) {
      #PRICES .price-card {
        padding: 30px; } }
    @media (min-width: 660px) {
      #PRICES .price-card {
        font-size: 1.5rem; } }
    #PRICES .price-card svg {
      width: 24px;
      height: 18px;
      stroke-width: 3px;
      margin-right: 8px;
      fill: none;
      stroke: #880088;
      stroke-linejoin: round;
      stroke-linecap: round;
      transform: translateY(2px); }
      @media (min-width: 660px) {
        #PRICES .price-card svg {
          width: 32px;
          height: 24px;
          stroke-width: 4px;
          margin-right: 15px; } }
    #PRICES .price-card .best-deal {
      background: #F8EFF8;
      position: absolute;
      font-size: 1rem;
      line-height: 28px;
      top: -14px;
      left: 50%;
      transform: translateX(-50%);
      padding: 0px 8px;
      background: #C380C3;
      border-radius: 5px;
      color: #FFF; }
      #PRICES .price-card .best-deal p {
        margin: 0; }
  #PRICES .the-price {
    padding: 30px 0; }
    #PRICES .the-price p.price {
      font-size: 2rem;
      font-weight: bold;
      line-height: 1;
      margin-bottom: 0; }
    #PRICES .the-price a {
      min-width: 180px;
      text-align: center; }
  #PRICES .the-details {
    display: inline-block;
    margin: 0 auto; }
    #PRICES .the-details p {
      text-align: left;
      margin-bottom: 5px; }

/*
#pricing{
	padding: 60px 30px;
	@include sm-tablet-up{padding: 90px 60px;}
	@include sm-desktop-up{padding: 120px 60px;}
	position: relative;
	svg.the-crown{
		position: absolute;
		top: -80px;
		left: 50%;
		background: $purple;
		border-radius: 99px;
		padding: 20px;
		width: 120px;
		height: 120px;
		transform: translateX(-60px);
		box-shadow: inset 0 0 0 4px #505;
		border: solid $red 4px;
	}
	@include sm-desktop-up {
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='100 0 2200 250'%3E%3ClinearGradient id='a' x1='0' x2='0' y1='0' y2='1'%3E%3Cstop offset='0' stop-color='%23CC3F47'/%3E%3Cstop offset='1' stop-color='%23F09F33'/%3E%3C/linearGradient%3E%3Cg stroke='url(%23a)' opacity='.2' fill='none' stroke-width='2'%3E%3Ccircle cx='100' cy='125' r='100'/%3E%3Cpath d='M2354 152 2186 31l-21 195z'/%3E%3C/g%3E%3C/svg%3E");
		background-size: contain;	
		background-position: center;	
		background-repeat: no-repeat;
	}
	.section-wrap{
		max-width: 900px;
		margin: 0 auto;
		display: grid;
		grid-template-columns: 1fr;
		grid-game: 0;
		@include sm-tablet-up {
			grid-template-columns: 1fr 1fr;
			grid-gap: 15px
		}
		@include md-tablet-up {
			grid-template-columns: 1fr minmax(auto, 300px) minmax(auto, 300px);
			grid-gap: 0;
		}
	}
	.detail-col{
		display: none;
		@include md-tablet-up {
			display: block;
		}
	}
	.price-col, .detail-col{
		position: relative;		
		width: 100%;
		margin: 0 auto 30px 0;
		border-radius: 10px;
		h2, .price{
			font-size: 30px;
			line-height: 34px;
			@include lg-tablet-up {
				font-size: 36px;
				line-height: 40px;
			}
			font-weight: bold;
			margin: 0;
		}
		.price{
			font-size: 36px;
			line-height: 42px;
			@include lg-tablet-up {
				font-size: 48px;
				line-height: 52px;
			}
		}		
	}
	.price-col{
		display: block;
		max-width: 320px;
		text-align: center;
		&.best-deal{
			background: $purple-subtle;
			&::before{
				position: absolute;
				content: "BEST DEAL";
				font-size: 1rem;
				line-height: 24px;
				top: -12px;			
				left: 50%;
				transform: translateX(-50%);
				padding: 0px 5px;
				background: $purple-medium;
				border-radius: 5px;
				color: #FFF;
			}
		}
	}
	.price-head{
		padding-top: 20px;
		height: 240px;
		display: flex;
    	justify-content: center;
    	align-items: center;
		p:first-of-type{color: $purple;}
		p:last-of-type{margin: 0;}
	}	
	.price-features{
		p{			
			padding: 0 5px;
			margin: 0;
			font-size: 1.25rem;
			line-height: 40px;
			@include lg-tablet-up {
				font-size: 26px;
				line-height: 56px;
			}
			@include sm-tablet-up {
				border-bottom: 1px solid $purple-light;
			}
			white-space: nowrap;
			.sm-hide{display: none;}
			.sm-show{display: inline-block;}
			@include md-tablet-up {
				.sm-hide{display: inline-block;}
				.sm-show{display: none;}
			}
		}
		svg{
			width: 32px;
			height: 24px;
			fill: none;
			stroke: $purple;
			stroke-width: 4px;
			stroke-linejoin: round;
			stroke-linecap: round;
			transform: translateY(2px);
		}
	}
	.price-foot{
		padding: 30px 0;
		a{
			min-width: 180px;
		}
	}
}
*/
#section-testimonials {
  padding: 120px 20px 60px 20px;
  background-image: radial-gradient(#606, #404, #202); }
  @media (min-width: 660px) {
    #section-testimonials {
      padding: 264px 30px 200px 30px; } }
  @media (min-width: 1200px) {
    #section-testimonials {
      padding: 264px 60px 200px 60px; } }
  @media (min-width: 660px) {
    #section-testimonials {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' width='100%25' height='100' viewBox='0 0 1600 100'%3E%3Cpath fill='%23FFF' d='M800 100 0 0 1600 0Z'/%3E%3C/svg%3E"), url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' width='100%25' height='100' viewBox='0 0 1600 100'%3E%3Cpath fill='%23FFF' d='M800 0 0 100 1600 100Z'/%3E%3C/svg%3E"), radial-gradient(#606, #404, #202);
      background-repeat: no-repeat;
      background-size: 100% 100px, 100% 100px, 100%;
      background-position: top center, bottom center, 50%; } }
  #section-testimonials .section-wrap {
    grid-gap: 90px;
    display: grid;
    max-width: 1400px;
    margin: 0 auto; }
    @media (min-width: 1200px) {
      #section-testimonials .section-wrap {
        grid-template-columns: 1fr 1fr 1fr;
        grid-gap: 60px; } }

.testimonial-box {
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 500px;
  margin: 0 auto;
  padding: 0 30px 30px 30px;
  background: #202;
  color: #FFF;
  text-align: center;
  align-items: center; }
  .testimonial-box img {
    margin: -64px auto 20px auto;
    width: 128px;
    height: 128px;
    padding: 4px;
    background: linear-gradient(55deg, #880088, #cc3f47, #f09f33);
    border-radius: 64px; }
  .testimonial-box a {
    font-size: 14px;
    color: #C380C3; }
  .testimonial-box .div-quote {
    display: table;
    flex-grow: 1;
    align-self: center; }
  .testimonial-box .t-quote {
    display: table-cell;
    padding: 15px 0;
    vertical-align: middle; }
  .testimonial-box .t-name {
    margin: 20px auto 0 auto; }
  .testimonial-box .t-source {
    line-height: 14px;
    margin: 0 auto; }
  @media (min-width: 1200px) {
    .testimonial-box {
      transform: translateY(20px); }
      .testimonial-box:nth-of-type(2) {
        transform: translateY(-20px); } }

a.hover-info svg {
  width: 16px;
  height: 16px;
  vertical-align: -1px; }
  a.hover-info svg circle {
    fill: #F0DFF0;
    transition: fill .2s ease; }
a.hover-info:hover svg circle {
  fill: #C380C3; }

a.btn-img {
  margin: 30px auto 0 auto;
  display: block;
  width: 100%;
  max-width: 1000px; }
  a.btn-img img {
    padding: 5px;
    border-radius: 12px;
    transition: opacity .2s ease; }
  a.btn-img:hover img {
    opacity: 0.8; }

.gallery-section {
  background: #FFF;
  padding: 0.25%;
  overflow: hidden; }

.gallery-wrap {
  display: flex;
  flex-wrap: wrap;
  margin: 0 -10%; }

@media (min-width: 900px) {
  .gallery-section .gallery-wrap:nth-child(2) {
    margin: 0 -17.5% 0 -7.5%; }

  .gallery-wrap:nth-child(1) {
    margin: 0 -5% 0 -20%; }
    .gallery-wrap:nth-child(1) img:nth-child(6) {
      display: none; } }
.gallery-section img {
  display: block;
  margin: 0;
  border-radius: 10px;
  width: 33%;
  height: 33%;
  padding: 0.25%; }
  @media (min-width: 660px) {
    .gallery-section img {
      width: 25%;
      height: 25%;
      padding: 0.25%; } }
  @media (min-width: 900px) {
    .gallery-section img {
      width: 20%;
      height: 20%;
      padding: 0.25%; } }

.gallery-section .gallery-wrap:nth-child(2) img:nth-child(n+4) {
  display: none; }
@media (min-width: 660px) {
  .gallery-section img:nth-child(6) {
    display: none; }
  .gallery-section .gallery-wrap:nth-child(1) img:nth-child(1) {
    display: none; }
  .gallery-section .gallery-wrap:nth-child(2) img:nth-child(4) {
    display: block; } }
@media (min-width: 900px) {
  .gallery-section .gallery-wrap:nth-child(1) img:nth-child(1) {
    display: block; }
  .gallery-section .gallery-wrap:nth-child(2) img:nth-child(5) {
    display: block; } }

#faq {
  max-width: 760px;
  margin: 0 auto;
  transition: height .2s ease-in-out; }

.faq-show p {
  display: block !important;
  color: #444;
  opacity: 1;
  animation: showFAQ 0.25s ease-in-out; }

@keyframes showFAQ {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }
.section-faq {
  padding: 120px 60px; }
  .section-faq h2 {
    text-align: center; }
  .section-faq h3 {
    color: #880088;
    margin: 0;
    line-height: 48px;
    padding: 7px 30px; }
    .section-faq h3:hover {
      text-decoration: underline; }
  .section-faq .faq-question {
    cursor: pointer;
    background: #F8EFF8;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' stroke-width='1.5' stroke='%23ffffff' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9' /%3E%3C/svg%3E");
    background-position: top 14px right 14px;
    background-repeat: no-repeat;
    background-size: 40px;
    border-radius: 10px;
    margin-bottom: 15px; }
    .section-faq .faq-question.faq-show {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' stroke-width='1.5' stroke='%23ffffff' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 15 12 9 18 15' /%3E%3C/svg%3E"); }
    .section-faq .faq-question p {
      display: none;
      padding: 7px 30px 30px 60px; }

/*  </subscribe page>   */
/*  could extend farther out  */
#promo {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
  text-align: center; }
  #promo a {
    display: block;
    padding: 50px;
    font-size: 1.4rem;
    color: #FFF !important;
    background: rgba(68, 0, 68, 0.8);
    box-shadow: inset 0 0 0 1px #880088;
    border-radius: 15px;
    transition: background .2s ease, box-shadow .2s ease; }
    #promo a h2 {
      font-size: 3.5rem;
      text-shadow: 1px 1px 2px #33003e, 2px 2px 5px #33003e; }
    #promo a p {
      margin: 0;
      padding: 15px;
      font-size: 1.4rem;
      border-radius: 50px;
      background: #880088;
      transition: background 2s ease; }
  #promo a:hover {
    background: #880088;
    background: #202;
    box-shadow: inset 0 0 0 2px #FFF;
    text-decoration: none; }
    #promo a:hover p {
      background: #cc3f47;
      background: #e78738; }

hr {
  border: none;
  border-top: 1px dotted #AAA;
  height: 1px;
  padding: 0; }

.cover-text {
  font-size: 400%;
  font-size: 5vw;
  text-align: center;
  padding: 175px 0; }

.thank-you {
  background-color: #722178 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1600 800'%3E%3Cg %3E%3Cpolygon fill='%23FFF' points='800 100 0 200 0 800 1600 800 1600 200'/%3E%3C/g%3E%3C/svg%3E") !important;
  background-size: cover  !important;
  background-position: top center  !important;
  padding-top: 20px !important;
  border-radius: 3px; }
  .thank-you .thank-you-icon {
    max-width: 100px;
    margin: 0 auto;
    padding: 5px; }

.thank-you ul {
  list-style: none;
  font-size: 1.2rem; }
  .thank-you ul li:before {
    content: "\2713\0020";
    font-weight: bold;
    color: #20A820; }

ul.detailed-list li {
  padding-bottom: 15px; }

.membership-content.large-post {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' preserveAspectRatio='none' width='1600' height='200' viewBox='0 0 1600 100'%3E%3Cpath fill='%23722178' d='M800 100 0 50 0 0 1600 0 1600 50Z'/%3E%3C/svg%3E");
  background-size: contain;
  background-position: top center;
  background-repeat: no-repeat;
  padding-top: 20px !important;
  border-radius: 3px; }
  .membership-content.large-post .thank-you-icon {
    max-width: 100px;
    margin: 0 auto;
    padding: 5px; }

.lead {
  font-size: 1.5rem; }

.cta-btn {
  color: #FFF !important;
  background: #fe4a54;
  transition: background .2s ease;
  display: inline-block;
  padding: 8px 16px;
  margin: 0 auto;
  border-radius: 50px; }
  @media (min-width: 660px) {
    .cta-btn {
      font-size: 1.2rem;
      padding: 10px 40px; } }

.cta-btn:hover {
  background: #b42c55;
  text-decoration: none; }

@media (max-width: 659px) {
  .phone-hide {
    display: none; } }
@media (min-width: 660px) {
  .phone-show {
    display: none; } }
.section-white {
  background: #FFF;
  padding-bottom: 50px;
  background-color: #dddddd;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25' viewBox='0 0 1600 800'%3E%3Cg fill-opacity='0.19'%3E%3Cpath fill='%23e0e0e0' d='M486 705.8c-109.3-21.8-223.4-32.2-335.3-19.4C99.5 692.1 49 703 0 719.8V800h843.8c-115.9-33.2-230.8-68.1-347.6-92.2C492.8 707.1 489.4 706.5 486 705.8z'/%3E%3Cpath fill='%23e4e4e4' d='M1600 0H0v719.8c49-16.8 99.5-27.8 150.7-33.5c111.9-12.7 226-2.4 335.3 19.4c3.4 0.7 6.8 1.4 10.2 2c116.8 24 231.7 59 347.6 92.2H1600V0z'/%3E%3Cpath fill='%23e7e7e7' d='M478.4 581c3.2 0.8 6.4 1.7 9.5 2.5c196.2 52.5 388.7 133.5 593.5 176.6c174.2 36.6 349.5 29.2 518.6-10.2V0H0v574.9c52.3-17.6 106.5-27.7 161.1-30.9C268.4 537.4 375.7 554.2 478.4 581z'/%3E%3Cpath fill='%23ebebeb' d='M0 0v429.4c55.6-18.4 113.5-27.3 171.4-27.7c102.8-0.8 203.2 22.7 299.3 54.5c3 1 5.9 2 8.9 3c183.6 62 365.7 146.1 562.4 192.1c186.7 43.7 376.3 34.4 557.9-12.6V0H0z'/%3E%3Cpath fill='%23eeeeee' d='M181.8 259.4c98.2 6 191.9 35.2 281.3 72.1c2.8 1.1 5.5 2.3 8.3 3.4c171 71.6 342.7 158.5 531.3 207.7c198.8 51.8 403.4 40.8 597.3-14.8V0H0v283.2C59 263.6 120.6 255.7 181.8 259.4z'/%3E%3Cpath fill='%23f1f1f1' d='M1600 0H0v136.3c62.3-20.9 127.7-27.5 192.2-19.2c93.6 12.1 180.5 47.7 263.3 89.6c2.6 1.3 5.1 2.6 7.7 3.9c158.4 81.1 319.7 170.9 500.3 223.2c210.5 61 430.8 49 636.6-16.6V0z'/%3E%3Cpath fill='%23f5f5f5' d='M454.9 86.3C600.7 177 751.6 269.3 924.1 325c208.6 67.4 431.3 60.8 637.9-5.3c12.8-4.1 25.4-8.4 38.1-12.9V0H288.1c56 21.3 108.7 50.6 159.7 82C450.2 83.4 452.5 84.9 454.9 86.3z'/%3E%3Cpath fill='%23f8f8f8' d='M1600 0H498c118.1 85.8 243.5 164.5 386.8 216.2c191.8 69.2 400 74.7 595 21.1c40.8-11.2 81.1-25.2 120.3-41.7V0z'/%3E%3Cpath fill='%23fcfcfc' d='M1397.5 154.8c47.2-10.6 93.6-25.3 138.6-43.8c21.7-8.9 43-18.8 63.9-29.5V0H643.4c62.9 41.7 129.7 78.2 202.1 107.4C1020.4 178.1 1214.2 196.1 1397.5 154.8z'/%3E%3Cpath fill='%23ffffff' d='M1315.3 72.4c75.3-12.6 148.9-37.1 216.8-72.4h-723C966.8 71 1144.7 101 1315.3 72.4z'/%3E%3C/g%3E%3C/svg%3E");
  background-attachment: fixed;
  background-size: cover;
  background-position: center; }

/* login form */
#login-section {
  padding: 30px 10px; }
  @media (min-width: 660px) {
    #login-section {
      padding: 50px 10px; } }
  #login-section h1 {
    text-align: center; }
  #login-section .login-form {
    margin: 0 auto;
    max-width: 500px;
    background: #FFF;
    padding: 30px; }
    @media (min-width: 660px) {
      #login-section .login-form {
        padding: 60px; } }
  #login-section .mp-form-row {
    padding: 5px 0; }

.mp_login_form input[type=text], .mp_login_form input[type=password], .mp_login_form input[type=email], .mp_login_form input[type=tel], .mp_login_form textarea, .mepr-form input[type=text], .mepr-form input[type=password], .mepr-form input[type=email], .mepr-form input[type=tel], .mepr-form textarea, .contact-form input[type=text], .contact-form input[type=password], .contact-form input[type=email], .contact-form input[type=tel], .contact-form textarea, #mepr-stripe-payment-form input[type=text], #mepr-stripe-payment-form input[type=password], #mepr-stripe-payment-form input[type=email], #mepr-stripe-payment-form input[type=tel], #mepr-stripe-payment-form textarea {
  width: 100%;
  background: #FFF;
  text-align: left;
  cursor: text;
  text-transform: none;
  font-size: 1.5rem;
  padding: 6px;
  border: 1px solid #CCC;
  box-shadow: 0 0 0 0 #450057;
  margin-bottom: 10px;
  border-width: 1px !important;
  border-radius: 2px; }
.mp_login_form input[type=text]:focus, .mp_login_form input[type=password]:focus, .mp_login_form input[type=email]:focus, .mp_login_form input[type=tel]:focus, .mp_login_form textarea:focus, .mepr-form input[type=text]:focus, .mepr-form input[type=password]:focus, .mepr-form input[type=email]:focus, .mepr-form input[type=tel]:focus, .mepr-form textarea:focus, .contact-form input[type=text]:focus, .contact-form input[type=password]:focus, .contact-form input[type=email]:focus, .contact-form input[type=tel]:focus, .contact-form textarea:focus, #mepr-stripe-payment-form input[type=text]:focus, #mepr-stripe-payment-form input[type=password]:focus, #mepr-stripe-payment-form input[type=email]:focus, #mepr-stripe-payment-form input[type=tel]:focus, #mepr-stripe-payment-form textarea:focus {
  border: 1px solid #450057;
  box-shadow: 0 0 0 1px #450057;
  box-shadow: 0 0 0 0 #450057;
  background: #F7F7F7;
  outline: none; }
.mp_login_form .mp-password-strength-area, .mepr-form .mp-password-strength-area, .contact-form .mp-password-strength-area, #mepr-stripe-payment-form .mp-password-strength-area {
  text-align: center; }
.mp_login_form .mp-password-strength-display, .mepr-form .mp-password-strength-display, .contact-form .mp-password-strength-display, #mepr-stripe-payment-form .mp-password-strength-display {
  width: 180px;
  margin: 0;
  border: none;
  border-radius: 50px;
  font-size: 0.8rem;
  padding: 2px; }
.mp_login_form .mepr_password_confirm, .mepr-form .mepr_password_confirm, .contact-form .mepr_password_confirm, #mepr-stripe-payment-form .mepr_password_confirm {
  margin: 0; }
.mp_login_form .submit, .mepr-form .submit, .contact-form .submit, #mepr-stripe-payment-form .submit {
  text-align: center; }
.mp_login_form input[type=submit], .mepr-form input[type=submit], .contact-form input[type=submit], #mepr-stripe-payment-form input[type=submit] {
  width: 100%;
  min-width: 150px;
  max-width: 300px;
  font-size: 1.2rem;
  border-radius: 50px;
  border: none;
  color: #FFF;
  background: #aa2068;
  cursor: pointer;
  padding: 10px;
  transition: background .2s ease, box-shadow .2s ease;
  text-transform: uppercase;
  margin: 0 auto;
  display: block;
  box-shadow: inset 8px -18px 20px -20px rgba(136, 0, 136, 0.2), inset -34px 73px 20px -60px rgba(240, 159, 51, 0.2); }
.mp_login_form input[type=submit]:hover, .mepr-form input[type=submit]:hover, .contact-form input[type=submit]:hover, #mepr-stripe-payment-form input[type=submit]:hover {
  background: #d55742;
  box-shadow: inset 40px -65px 60px -60px #880088, inset -30px 70px 20px -60px rgba(240, 159, 51, 0.8); }
.mp_login_form .form-row, .mepr-form .form-row, .contact-form .form-row, #mepr-stripe-payment-form .form-row {
  padding: 5px 0; }
.mp_login_form .emailfield, .mepr-form .emailfield, .contact-form .emailfield, #mepr-stripe-payment-form .emailfield {
  display: none; }
.mp_login_form .errormessage, .mepr-form .errormessage, .contact-form .errormessage, #mepr-stripe-payment-form .errormessage {
  color: #fe4a54 !important; }
.mp_login_form .mepr_mepr_trial_period, .mp_login_form .mepr_mepr_trial_type, .mp_login_form .mepr_mepr_registration_url, .mp_login_form .mepr_mepr_ip_address, .mp_login_form .mepr_mepr_current_url, .mepr-form .mepr_mepr_trial_period, .mepr-form .mepr_mepr_trial_type, .mepr-form .mepr_mepr_registration_url, .mepr-form .mepr_mepr_ip_address, .mepr-form .mepr_mepr_current_url, .contact-form .mepr_mepr_trial_period, .contact-form .mepr_mepr_trial_type, .contact-form .mepr_mepr_registration_url, .contact-form .mepr_mepr_ip_address, .contact-form .mepr_mepr_current_url, #mepr-stripe-payment-form .mepr_mepr_trial_period, #mepr-stripe-payment-form .mepr_mepr_trial_type, #mepr-stripe-payment-form .mepr_mepr_registration_url, #mepr-stripe-payment-form .mepr_mepr_ip_address, #mepr-stripe-payment-form .mepr_mepr_current_url {
  display: none; }

.email-image {
  max-width: 300px;
  padding: 10px 30px; }

.grecaptcha {
  text-align: center; }

.g-recaptcha {
  display: inline-block; }

.mp-form-submit {
  text-align: center; }
  .mp-form-submit span::before {
    content: "\A";
    white-space: pre; }

.mepr-form-has-errors {
  width: 100%;
  color: #C00;
  font-weight: bold;
  font-size: 1.5rem; }

.cc-error {
  color: #C00; }

.mepr-account-change-password {
  display: block;
  width: 100%;
  text-align: center; }

#mepr-account-nav .mepr-nav-item #mepr-account-logout {
  display: none; }

/*  membership template  */
.membership-content {
  margin: 0 auto;
  background: #FFF;
  padding: 50px;
  max-width: 600px; }

/* <Converter> */
#converter {
  display: grid;
  grid-template-columns: 1fr 60px 1fr;
  padding: 60px; }
  #converter .wrap {
    padding: 30px 0; }
  #converter textarea {
    scrollbar-color: #404 #880088;
    resize: none; }
    #converter textarea::-webkit-scrollbar {
      width: 20px; }
    #converter textarea::-webkit-scrollbar-track {
      background: #404; }
    #converter textarea::-webkit-scrollbar-thumb {
      background-color: #880088;
      border-radius: 6px;
      border: 3px solid #404; }

.content-card,
.content-box {
  background: #FFF;
  max-width: 1200px;
  margin: 100px auto; }
  .content-card .wrap,
  .content-box .wrap {
    padding: 60px 90px; }
  .content-card textarea,
  .content-box textarea {
    background-color: #F8EFF8;
    border: 1px solid #F0DFF0;
    overflow: auto;
    padding: 15px;
    font-size: 1rem;
    line-height: 20px;
    box-shadow: inset 0 0 0 0 #F8EFF8;
    transition: box-shadow .2s ease; }
    .content-card textarea:active, .content-card textarea:focus, .content-card textarea:focus-within, .content-card textarea:focus-visible,
    .content-box textarea:active,
    .content-box textarea:focus,
    .content-box textarea:focus-within,
    .content-box textarea:focus-visible {
      outline: none;
      border-color: #880088;
      box-shadow: inset 0 0 0 3px #880088; }

.tight h2 {
  margin: 0; }

span.code {
  background: #F8EFF8;
  color: #404;
  padding: 0 5px; }

.content-card {
  display: grid;
  grid-template-columns: 1fr .4fr; }
  .content-card .svg-wrap {
    background: #F8EFF8;
    padding: 30px;
    display: flex;
    align-items: center;
    justify-content: center; }
    .content-card .svg-wrap svg {
      fill: none;
      stroke: #880088;
      stroke-width: 2px;
      max-width: 192px; }

.purple-stroke {
  stroke-width: 2px;
  fill: none;
  stroke: #880088; }

.middle-col {
  text-align: center;
  align-self: center; }
  .middle-col button.btn-purple {
    padding: 10px;
    border: none; }
    .middle-col button.btn-purple svg {
      display: block;
      width: 32px;
      height: 32px;
      fill: none;
      stroke: #880088;
      stroke: #FFF;
      stroke-width: 2px; }

/* </Converter> */
.white-emoji {
  line-height: 50px;
  vertical-align: middle !important; }
  .white-emoji img.emoji {
    background: #FFF !important;
    border-radius: 99px;
    padding: 6px !important;
    width: 40px !important;
    height: 40px !important; }
  .white-emoji img {
    vertical-align: -6px !important; }

/*<blog>*/
svg.blog-art {
  background: #F8EFF8;
  fill: #880088;
  border-radius: 10px;
  overflow: hidden;
  margin-bottom: 37px; }

#blogContent {
  background: #FFF !important;
  box-shadow: inset 0 1px 0 0 #F0DFF0; }
  #blogContent.blogHome {
    background-color: #F8EFF8 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='250' height='30' viewBox='0 0 1000 120'%3E%3Cg fill='none' stroke='%23808' stroke-width='16' stroke-opacity='0.03'%3E%3Cpath d='M-500 75c0 0 125-30 250-30S0 75 0 75s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 45c0 0 125-30 250-30S0 45 0 45s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 105c0 0 125-30 250-30S0 105 0 105s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 15c0 0 125-30 250-30S0 15 0 15s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500-15c0 0 125-30 250-30S0-15 0-15s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3Cpath d='M-500 135c0 0 125-30 250-30S0 135 0 135s125 30 250 30s250-30 250-30s125-30 250-30s250 30 250 30s125 30 250 30s250-30 250-30'/%3E%3C/g%3E%3C/svg%3E") !important; }
    #blogContent.blogHome .post {
      background: none; }
  #blogContent img {
    max-width: 100%;
    height: auto; }
  #blogContent a {
    transition: color .2s ease, background .2s ease; }
  #blogContent .post {
    background: #FFF;
    border: none;
    width: 100%;
    max-width: 750px;
    margin: 0 auto;
    font-size: 1.25rem;
    line-height: 37px;
    padding: 23px; }
    @media (min-width: 660px) {
      #blogContent .post {
        font-size: 22px; } }
    @media (min-width: 900px) {
      #blogContent .post {
        padding: 37px; } }
    #blogContent .post.updates {
      max-width: 970px; }
      #blogContent .post.updates .update {
        background: #F8EFF8;
        margin: 37px auto 37px auto;
        padding: 15px;
        border-radius: 15px; }
        @media (min-width: 660px) {
          #blogContent .post.updates .update {
            padding: 15px 30px; } }
        @media (min-width: 1200px) {
          #blogContent .post.updates .update {
            padding: 30px 60px; } }
        #blogContent .post.updates .update h2 {
          font-size: 1.5rem;
          margin-bottom: 0;
          line-height: 1.2; }
          @media (min-width: 660px) {
            #blogContent .post.updates .update h2 {
              font-size: 1.8rem; } }
          @media (min-width: 1200px) {
            #blogContent .post.updates .update h2 {
              font-size: 2rem; } }
        #blogContent .post.updates .update .video-player {
          margin-bottom: 37px; }
  #blogContent div.postTeaser {
    padding: 0 10px;
    margin: 30px 0;
    background: rgba(255, 255, 255, 0.7);
    box-shadow: 0 0.8px 2.2px rgba(68, 0, 68, 0.02), 0 2px 5.3px rgba(68, 0, 68, 0.028), 0 3.8px 10px rgba(68, 0, 68, 0.035), 0 6.7px 17.9px rgba(68, 0, 68, 0.042), 0 12.5px 33.4px rgba(68, 0, 68, 0.05), 0 30px 80px rgba(68, 0, 68, 0.07);
    border-radius: 5px; }
    #blogContent div.postTeaser h3 {
      margin-top: 15px; }
    @media (min-width: 660px) {
      #blogContent div.postTeaser {
        margin: 60px 0; } }
  #blogContent p.blogDetails {
    font-size: 1rem;
    color: #C380C3; }
    @media (min-width: 660px) {
      #blogContent p.blogDetails {
        font-size: 22px; } }
    #blogContent p.blogDetails img {
      width: 48px;
      height: 48px;
      border-radius: 32px;
      margin: 0 10px; }
    #blogContent p.blogDetails a {
      color: #C380C3; }
      #blogContent p.blogDetails a:hover {
        color: #880088; }
    #blogContent p.blogDetails.blogPost {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin: 0; }
      #blogContent p.blogDetails.blogPost a {
        color: #FFF;
        padding: 5px 30px; }
  #blogContent li > code,
  #blogContent p > code {
    display: inline-block;
    background: #F8EFF8;
    color: #404;
    padding: 0 5px;
    border-radius: 5px; }
  #blogContent h1 {
    color: #880088;
    font-size: 36px;
    line-height: 1.2;
    margin-bottom: 14px; }
    @media (min-width: 660px) {
      #blogContent h1 {
        font-size: 48px; } }
    @media (min-width: 900px) {
      #blogContent h1 {
        font-size: 58px; } }
  #blogContent h2, #blogContent h3, #blogContent h4, #blogContent h5 {
    color: #404;
    line-height: 1.5; }
  #blogContent h2 {
    font-size: 32px;
    margin-bottom: 37px; }
    @media (min-width: 660px) {
      #blogContent h2 {
        font-size: 36px; } }
    @media (min-width: 900px) {
      #blogContent h2 {
        font-size: 45px; } }
    @media (min-width: 900px) {
      #blogContent h2 {
        line-height: 71px; } }
  #blogContent h3 {
    font-size: 24px;
    margin-top: 60px;
    margin-bottom: 23px; }
    @media (min-width: 660px) {
      #blogContent h3 {
        font-size: 28px; } }
    @media (min-width: 900px) {
      #blogContent h3 {
        font-size: 36px; } }
    @media (min-width: 900px) {
      #blogContent h3 {
        line-height: 58px; } }
  #blogContent h4 {
    font-size: 22px;
    margin-top: 37px;
    margin-bottom: 14px; }
    @media (min-width: 660px) {
      #blogContent h4 {
        font-size: 24px; } }
    @media (min-width: 900px) {
      #blogContent h4 {
        font-size: 28px; } }
    @media (min-width: 900px) {
      #blogContent h4 {
        line-height: 46px; } }
  #blogContent h5 {
    font-size: 1.25rem;
    font-weight: bold;
    margin-bottom: 9px; }
    @media (min-width: 900px) {
      #blogContent h5 {
        font-size: 24px; } }
    @media (min-width: 900px) {
      #blogContent h5 {
        line-height: 37px; } }
  #blogContent strong, #blogContent b {
    color: #404; }
  #blogContent p, #blogContent ul, #blogContent ol, #blogContent blockquote, #blogContent pre, #blogContent .alert, #blogContent .note, #blogContent .box, #blogContent .footnotes {
    margin-bottom: 37px; }
  #blogContent ul, #blogContent ol {
    margin-left: 37px;
    padding: 0;
    position: relative; }
  #blogContent li {
    margin-bottom: 14px; }
  #blogContent ol li::marker {
    color: #880088; }
  #blogContent ul li:before {
    content: '';
    position: absolute;
    display: block;
    left: -32px;
    transform: translateY(7px);
    height: 24px;
    width: 24px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='%23E5C8E5'%3E%3Cpath d='M11 5.8c0 .4.1.7.4.9L16 11c.5.5.5 1.4 0 1.9l-4.6 4.3c-.3.2-.4.6-.4.9 0 1.1 1.3 1.7 2.1.9l6.8-6.2c.6-.5.6-1.4 0-1.9l-6.8-6.2c-.8-.5-2.1.1-2.1 1.1zM3 5.8c0 .4.1.7.4.9L8 11.1c.5.5.5 1.4 0 1.9l-4.6 4.3c-.3.2-.4.5-.4.9 0 1.1 1.3 1.7 2.1.9l6.8-6.2c.6-.5.6-1.4 0-1.9L5.1 4.9c-.8-.7-2.1-.1-2.1.9z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
    background-size: contain;
    background-repeat: no-repeat; }
  #blogContent ul li li:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='%23E5C8E5'%3E%3Cpath d='M7 16.2V7.8c0-.8.8-1.3 1.5-.9l7.1 4.2c.6.4.6 1.3 0 1.7L8.5 17c-.7.5-1.5 0-1.5-.8z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E");
    left: -29px; }
  #blogContent ul {
    list-style: none; }
  #blogContent blockquote {
    display: grid;
    grid-template-columns: 63px 1fr;
    align-items: center;
    padding: 14px 23px 14px 0;
    background: #F8EFF8;
    box-shadow: inset 63px 0 0 0 #C380C3; }
    #blogContent blockquote p {
      margin: 0;
      padding-left: 23px; }
    #blogContent blockquote::before {
      content: "";
      display: block;
      margin: 0 auto;
      width: 40px;
      height: 40px;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' stroke-width='1.5' stroke='%23FFF' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 12h1m8-9v1m8 8h1M5.6 5.6l.7.7m12.1-.7l-.7.7M9 16a5 5 0 116 0 3.5 3.5 0 00-1 3 2 2 0 01-4 0 3.5 3.5 0 00-1-3M9.7 17h4.6'/%3E%3C/svg%3E");
      background-position: center left;
      background-size: 40px;
      background-repeat: no-repeat; }
    #blogContent blockquote.author img {
      max-width: 100px;
      border-radius: 99px; }
    #blogContent blockquote.author::before {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' stroke-width='1.5' stroke='%23FFF' fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='7' r='4' /%3E%3Cpath d='M6 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2' /%3E%3C/svg%3E"); }
  #blogContent .pagination .nav-links {
    text-align: center; }
  #blogContent .screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal !important; }
  #blogContent sub, #blogContent sup {
    padding: 0 1px; }
  #blogContent code, #blogContent pre, #blogContent kbd {
    font-size: 1.25rem; }
  #blogContent pre {
    padding: 14px 23px; }
  #blogContent kbd {
    background-color: #fff;
    padding: 5px 6px;
    border-radius: 6px;
    box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.45);
    margin: 0 1px; }
  #blogContent .alert, #blogContent .note, #blogContent .box {
    padding: 23px; }
  #blogContent .footnotes {
    font-size: 17px;
    line-height: 30px;
    padding-top: 23px;
    border-top: 1px dotted rgba(0, 0, 0, 0.15); }
  #blogContent .footnotes p {
    margin-bottom: 23px; }
  #blogContent ul ul, #blogContent ul ol, #blogContent ol ul, #blogContent ol ol, #blogContent blockquote.right p, #blogContent blockquote.left p, #blogContent .alert :last-child, #blogContent .note :last-child, #blogContent .box :last-child, #blogContent .footnotes :last-child {
    margin-bottom: 0; }
  #blogContent pre.language-markup,
  #blogContent pre.language-css {
    background: #202;
    color: #FFF;
    border-radius: 5px;
    margin: 0 0 37px 0;
    scrollbar-color: #404 #880088;
    resize: none; }
    #blogContent pre.language-markup.sharp,
    #blogContent pre.language-css.sharp {
      border-radius: 0; }
    #blogContent pre.language-markup code *,
    #blogContent pre.language-css code * {
      background: none !important; }
    #blogContent pre.language-markup::-webkit-scrollbar,
    #blogContent pre.language-css::-webkit-scrollbar {
      width: 20px; }
    #blogContent pre.language-markup::-webkit-scrollbar-track,
    #blogContent pre.language-css::-webkit-scrollbar-track {
      background: #404; }
    #blogContent pre.language-markup::-webkit-scrollbar-thumb,
    #blogContent pre.language-css::-webkit-scrollbar-thumb {
      background-color: #880088;
      border-radius: 6px;
      border: 3px solid #404; }
    #blogContent pre.language-markup.wrap code,
    #blogContent pre.language-css.wrap code {
      white-space: normal !important;
      word-break: break-word !important; }
  #blogContent .wp-block-columns {
    display: grid;
    grid-gap: 15px; }
    @media (min-width: 660px) {
      #blogContent .wp-block-columns {
        grid-template-columns: 1fr 1fr; } }
    @media (min-width: 900px) {
      #blogContent .wp-block-columns {
        grid-gap: 30px; } }
  #blogContent .wp-block-gallery ul {
    margin: 0 0 37px 0;
    padding: 0;
    list-style: none;
    display: grid;
    grid-gap: 14px;
    grid-template-columns: 1fr; }
    @media (min-width: 660px) {
      #blogContent .wp-block-gallery ul {
        grid-template-columns: 1fr 1fr; } }
    #blogContent .wp-block-gallery ul li {
      margin: 0; }
      #blogContent .wp-block-gallery ul li figure {
        margin: 0;
        position: relative; }
  @media (min-width: 900px) {
    #blogContent .wp-block-gallery.columns-3 ul {
      grid-template-columns: 1fr 1fr 1fr; } }
  @media (min-width: 900px) {
    #blogContent .wp-block-gallery.columns-4 ul {
      grid-template-columns: 1fr 1fr 1fr 1fr; } }
  #blogContent .wp-block-gallery figcaption {
    position: absolute;
    z-index: 3;
    bottom: 0;
    left: 0;
    display: inline-block;
    background: #404;
    color: #FFF;
    padding: 4px 8px;
    font-size: 14px;
    line-height: 22px;
    border-radius: 0 5px 0 0; }
  #blogContent .wp-block-image {
    margin-bottom: 37px; }
    #blogContent .wp-block-image figcaption {
      padding: 7px;
      line-height: 1.2;
      font-size: 14px;
      font-style: italic;
      color: #C380C3;
      text-align: center; }
  #blogContent .example {
    display: flex;
    background: #F8EFF8;
    padding: 37px;
    margin-top: -37px;
    margin-bottom: 37px; }
    #blogContent .example p {
      display: inline-block;
      margin-bottom: 0; }
  #blogContent ul.short li {
    margin-bottom: 0; }

.has-purple-color {
  color: #880088; }

.has-dark-color {
  color: #404; }

.acf-form .wp-picker-container .wp-color-result.button {
  min-height: 48px;
  margin: 0 6px 0 0;
  border: none;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.1), inset 0 0 3px 0 rgba(0, 0, 0, 0.1);
  padding: 0 0 0 48px;
  border-radius: 6px;
  transition: background .2s ease, box-shadow .2s ease; }
  .acf-form .wp-picker-container .wp-color-result.button .wp-color-result-text {
    font-size: 1rem;
    line-height: 48px;
    background: rgba(255, 255, 255, 0.95);
    padding: 0 15px;
    border-radius: 0 5px 5px 0;
    border: none;
    box-shadow: -3px 0 3px -3px rgba(0, 0, 0, 0.1), inset 0 0 0 1px rgba(0, 0, 0, 0.1);
    transition: background .2s ease, box-shadow .2s ease; }
  .acf-form .wp-picker-container .wp-color-result.button:hover {
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2), inset 0 0 3px 0 rgba(0, 0, 0, 0.2); }
    .acf-form .wp-picker-container .wp-color-result.button:hover .wp-color-result-text {
      box-shadow: -6px 0 6px -6px rgba(0, 0, 0, 0.2), inset 0 0 0 1px rgba(0, 0, 0, 0.2);
      background: rgba(255, 255, 255, 0.85); }
.acf-form .wp-picker-container input[type=text].wp-color-picker {
  width: 100px; }
.acf-form .wp-picker-container input[type=button].button.wp-picker-clear {
  padding: 0 15px;
  font-size: 1.2rem;
  line-height: 48px; }
.acf-form .wp-picker-container input[type=button]:hover.button.wp-picker-clear {
  background: #F8EFF8; }
.acf-form .acf-true-false .acf-switch {
  border-radius: 999px !important;
  font-size: 1rem;
  height: 45px;
  border: none;
  background-color: #F0DFF0;
  box-shadow: inset 0 0 3px 0 rgba(136, 0, 136, 0.2), inset -1px -1px 0 0 rgba(68, 0, 68, 0.1); }
  .acf-form .acf-true-false .acf-switch.-on {
    background-color: #880088; }
    .acf-form .acf-true-false .acf-switch.-on .acf-switch-slider {
      left: 50%;
      right: 4px; }
    .acf-form .acf-true-false .acf-switch.-on span {
      color: #FFF; }
  .acf-form .acf-true-false .acf-switch .acf-switch-slider {
    border-radius: 999px;
    border: none;
    top: 4px;
    left: 4px;
    bottom: 4px;
    right: 50%;
    box-shadow: 1px 1px 3px 0 rgba(136, 0, 136, 0.2), 1px 1px 0 0 rgba(68, 0, 68, 0.1); }
  .acf-form .acf-true-false .acf-switch span {
    font-size: 1.2rem;
    line-height: 42px;
    vertical-align: middle;
    padding: 0 16px;
    color: #404; }
  .acf-form .acf-true-false .acf-switch:hover {
    background-color: #DAB0DA; }
    .acf-form .acf-true-false .acf-switch:hover span {
      color: #808; }
    .acf-form .acf-true-false .acf-switch:hover.-on {
      background-color: #606; }
      .acf-form .acf-true-false .acf-switch:hover.-on span {
        color: #FFF; }
.acf-form .acf-form-submit {
  text-align: center; }
  .acf-form .acf-form-submit button {
    border: none; }
.acf-form > .acf-fields > .acf-field {
  display: grid;
  grid-template-columns: 300px 1fr;
  grid-gap: 30px;
  padding: 30px 0; }

/*</blog>*/
#CLIPBOARD {
  position: fixed;
  bottom: 9999px;
  right: 9999px;
  width: 500px; }

.notifyBox {
  padding: 0;
  text-align: center;
  display: inline-flex;
  justify-content: center;
  position: absolute;
  z-index: 9999999;
  opacity: 1;
  font-size: 1rem;
  background-color: #880088;
  background-color: #aa2068;
  background-color: #C380C3;
  color: #FFF;
  transition: opacity .5s ease;
  pointer-events: none; }
  .notifyBox.fadeOut {
    opacity: 0; }

#slider-1,
#slider-2,
#slider-3,
#slider-4,
#slider-5 {
  position: relative;
  z-index: 1; }

.tooltipBubble {
  background: #c380c3;
  color: white;
  padding: 0 4px;
  font-size: 12px;
  line-height: 1.45;
  position: absolute;
  z-index: 9;
  border-radius: 4px;
  top: -15px;
  left: 50%;
  transform: translateX(-50%);
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease; }
  .tooltipBubble.active {
    opacity: 1; }

.tooltipBubble::after {
  content: "";
  position: absolute;
  z-index: 2;
  width: 12px;
  height: 6px;
  background: #c380c3;
  bottom: -4px;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
  transform: translateX(-50%);
  clip-path: polygon(50% 100%, 0 0, 100% 0); }

.disable_arrows li:before {
  content: none !important; }

#mepr-account-subscriptions-table .mepr-account-suspend:after, #mepr-account-subscriptions-table .mepr-account-cancel:after {
  content: " subscription"; }
#mepr-account-subscriptions-table .mepr-account-update:after {
  content: " payment"; }

.mepr-account-actions a, td[data-label="Download"] a {
  white-space: nowrap;
  padding: 5px; }
  .mepr-account-actions a:hover, td[data-label="Download"] a:hover {
    background: #F8EFF8; }

.mepr-account-table tbody {
  font-size: 1.2rem;
  line-height: 1.25; }

/* <contact forms (wpform)> */
#blogContent form input[type=text], #blogContent form input[type=email], #blogContent form textarea {
  text-align: left;
  font-size: 1.25rem; }
#blogContent form label.wpforms-field-label {
  font-size: 1.25rem; }
#blogContent form button.wpforms-submit {
  background: #880088;
  color: #FFF;
  border-radius: 99px;
  padding: 10px 30px; }
  #blogContent form button.wpforms-submit:hover {
    background: #aa2068; }

/* </contact forms (wpform)> */
/* <Mailer Lite footer form> */

.ml-subscribe-form a:hover {
  cursor: pointer !important; }
.ml-subscribe-form .subscribe-form {
  padding: 20px 0 0 0; }
.ml-subscribe-form button {
  border: none;
  width: 100%;
  border-radius: 5px;
  height: 45px;
  background-color: #808;
  color: #FFF;
  font-size: 1.125rem;
  text-align: center;
  position: relative; }
  @media (min-width: 660px) {
    .ml-subscribe-form button {
      border-radius: 0 5px 5px 0; } }
  .ml-subscribe-form button:hover {
    background-color: #aa2068; }
.ml-subscribe-form button[disabled] {
  cursor: not-allowed !important; }
.ml-subscribe-form .ml-error {
  color: red; }
.ml-subscribe-form .ml-block-success {
  color: #880088;
  font-size: 1.125rem; }
.ml-subscribe-form form.ml-block-form .subscribe-form {
  display: grid; }
  @media (min-width: 660px) {
    .ml-subscribe-form form.ml-block-form .subscribe-form {
      grid-template-columns: 7fr 3fr; }
      .ml-subscribe-form form.ml-block-form .subscribe-form .form-section.horizontal,
      .ml-subscribe-form form.ml-block-form .subscribe-form .form-section.horizontal.ml-button-position,
      .ml-subscribe-form form.ml-block-form .subscribe-form .form-section.horizontal .form-group {
        width: 100%;
        padding: 0; }
      .ml-subscribe-form form.ml-block-form .subscribe-form .ml-form-visible-xs {
        display: block; }
      .ml-subscribe-form form.ml-block-form .subscribe-form .ml-form-hidden-xs {
        display: none; } }
  .ml-subscribe-form form.ml-block-form .subscribe-form .form-section.horizontal .form-group .form-control {
    height: 45px; }
  .ml-subscribe-form form.ml-block-form .subscribe-form .ml-form-visible-xs {
    display: none; }
  .ml-subscribe-form form.ml-block-form .subscribe-form .form-section.horizontal.ml-button-position.top-padding {
    padding-top: 24px; }
  .ml-subscribe-form form.ml-block-form .subscribe-form .form-section p,
  .ml-subscribe-form form.ml-block-form .subscribe-form .form-section li {
    line-height: 150%; }
.ml-subscribe-form .form-group .form-control {
  width: 100%;
  font-size: 1.125rem;
  padding: 0 10px;
  line-height: 45px;
  border-radius: 5px;
  border: 1px solid #DAB0DA;
  color: #000;
  background-color: #FFF;
  clear: left; }
  @media (min-width: 660px) {
    .ml-subscribe-form .form-group .form-control {
      border-radius: 5px 0 0 5px;
      border-right-width: 0px; } }
.ml-subscribe-form .form-group.ml-error .form-control {
  border-color: red; }

/* </Mailer Lite footer form> */
*{
  margin:0;
  padding:0;
}

.container{  padding-top: 20px;
  padding-bottom: 20px;}
body{
  background-color: #111845;
}

.background-img{
  background-image: url("https://3.bp.blogspot.com/-piZWCW2uUbg/W2fPXxkWZgI/AAAAAAAAOu0/eydmMjTIqcwLMHEEr2H7imqoRTxMw4o9QCLcBGAs/s1600/among_trees_night_dribbble.png");
height: 400px;
  width: 800px;
  background-repeat: no-repeat;
  background-size: cover;
  margin: 5% auto;
  padding:20px;
  border: 1px solid #2a3cad;
  border-radius: 4px;
  box-shadow: 0px 0px 5px #2a3cad;
  position: relative;
}

.content h2{ font-size:19px;}

.box{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 400px;
  height: 400px;
  background: #111845a6;
  box-sizing: border-box;
  overflow: hidden;
  box-shadow: 0 20px 50px rgb(23, 32, 90);
  border: 2px solid #2a3cad;
  color: white;
  padding: 20px;
}

.box:before{
  content: '';
  position:absolute;
  top:0;
  left:-100%;
  width:100%;
  height:100%;
  background: rgba(255,255,255,0.1);
  transition:0.5s;
  pointer-events: none;
}

.box:hover:before{
  left:-50%;
  transform: skewX(-5deg);
}


.box .content{
  position:absolute;
  top:15px;
  left:15px;
  right:15px;
  bottom:15px;
  border:1px solid #f0a591;
  padding:20px;
  text-align:center;
  box-shadow: 0 5px 10px rgba(9,0,0,0.5);
  
}

.box span{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: block;
  box-sizing: border-box;
  
}

.box span:nth-child(1)
{
  transform:rotate(0deg);
}

.box span:nth-child(2)
{
  transform:rotate(90deg);
}

.box span:nth-child(3)
{
  transform:rotate(180deg);
}

.box span:nth-child(4)
{
  transform:rotate(270deg);
}

.box span:before
{
  content: '';
  position: absolute;
  width:100%;
  height: 2px;
  background: #50dfdb;
  animation: animate 4s linear infinite;
}

@keyframes animate {
  0% {
  transform:scaleX(0);
  transform-origin: left;
  }
  50%
  {
    transform:scaleX(1);
  transform-origin: left;
  }
  50.1%
  {
    transform:scaleX(1);
  transform-origin: right;
    
  }
  
  100%
  {
    transform:scaleX(0);
  transform-origin: right;
    
  }
  
  
}